@oxy.so/bloom 4.0.0 → 4.2.0

package/lib/typescript/module/order-confirmation/types.d.ts

@@ -0,0 +1,88 @@
+import type { ReactNode } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { AddressKind } from '../address';
+import type { EmptyStateAction, EmptyStateVariant } from '../empty-state';
+import type { BloomIconComponent } from '../icons/icon-component';
+import type { OrderStatusBarProps } from '../order-status';
+/**
+ * One reading of the receipt: when it arrives, what was charged, who is
+ * bringing it.
+ *
+ * `value` is PRE-FORMATTED, like every string in this family — a time, an
+ * amount, a courier's name. Nothing here reads a clock or adds a number.
+ */
+export interface OrderConfirmationFact {
+    /** Stable key. Defaults to the label. */
+    id?: string;
+    /** "Arrives", "Paid with", "Courier". */
+    label: string;
+    /** "Today, 17:00 – 19:00", "•••• 4417", "Mireia". */
+    value: string;
+}
+/** Where it is going, drawn with `address`'s own `AddressRow`. */
+export interface OrderConfirmationAddress {
+    /** The line the place is recognised by — "Home". */
+    title: string;
+    /** The rest of it. */
+    subtitle?: string;
+    /** Chooses the glyph. Default `place`. */
+    kind?: AddressKind;
+    /** The glyph, overriding whatever `kind` would have chosen. */
+    icon?: BloomIconComponent;
+    /** A node after the title — a `Badge`. */
+    badge?: ReactNode;
+    /** A short trailing reading — "1.2 km". */
+    meta?: string;
+    testID?: string;
+}
+export interface OrderConfirmationProps {
+    /** Default `"Your order is placed"`. */
+    title?: string;
+    /** The line under it — "We have sent the receipt to your inbox." */
+    description?: string;
+    /**
+     * The mark above the title. Default a check on a success-tinted disc — a
+     * STATIC one, because `AnimatedCheck` draws itself on only when a caller
+     * kicks it through its ref, and a mark nobody can see until a method runs is
+     * not a mark. Pass `<AnimatedCheck>` (played by your own ref) for the
+     * draw-on, a brand mark, or `null` for none.
+     */
+    mark?: ReactNode;
+    /** The default mark's box. Default 56. */
+    markSize?: number;
+    /** The order's own number — "A-4821". PRE-FORMATTED, including any prefix. */
+    reference?: string;
+    /** The caption above it. Default `"Order number"`. */
+    referenceLabel?: string;
+    /**
+     * The tracking strip — `order-status`'s `OrderStatusBar`, passed straight
+     * through. This family draws no second one: "where it is right now" has one
+     * component in the library and this is a place that shows it.
+     */
+    status?: OrderStatusBarProps;
+    /** Where it goes. */
+    address?: OrderConfirmationAddress;
+    /** When it arrives, what was charged, and anything else worth reading back. */
+    facts?: readonly OrderConfirmationFact[];
+    /**
+     * What was ordered, in full — the basket's own rows, rendered by the app.
+     * A slot rather than data: a line of an order is a dish, a parcel or a seat
+     * depending on the app, and each already has a row family of its own.
+     */
+    items?: ReactNode;
+    /** The caption above `items`. Default `"What you ordered"`. */
+    itemsLabel?: string;
+    /** The first thing you do next — normally "Track order". */
+    action?: EmptyStateAction;
+    /** The other one — normally "Get help". */
+    secondaryAction?: EmptyStateAction;
+    /** Under the actions — a "Back to the shop" link, a note. */
+    footer?: ReactNode;
+    /** Default `comfortable`. `compact` is the panel rung. */
+    variant?: EmptyStateVariant;
+    /** Names the whole surface. Defaults to the title and the reference. */
+    accessibilityLabel?: string;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/lib/typescript/module/order-confirmation/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/order-confirmation/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,KAAK,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAC1E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D;;;;;;GAMG;AACH,MAAM,WAAW,qBAAqB;IACpC,yCAAyC;IACzC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,kEAAkE;AAClE,MAAM,WAAW,wBAAwB;IACvC,oDAAoD;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,sBAAsB;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,+DAA+D;IAC/D,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,0CAA0C;IAC1C,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,sBAAsB;IACrC,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;OAIG;IACH,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAE7B,qBAAqB;IACrB,OAAO,CAAC,EAAE,wBAAwB,CAAC;IAEnC,+EAA+E;IAC/E,KAAK,CAAC,EAAE,SAAS,qBAAqB,EAAE,CAAC;IAEzC;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,+DAA+D;IAC/D,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,2CAA2C;IAC3C,eAAe,CAAC,EAAE,gBAAgB,CAAC;IACnC,6DAA6D;IAC7D,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,0DAA0D;IAC1D,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,wEAAwE;IACxE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/lib/typescript/module/page-header/PageHeader.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { PageHeaderProps } from './types';
-declare function PageHeaderComponent({ title, subtitle, titleAlign, headingLevel, titleReveal, presentation, placement, onBack, backLabel, leading, actions, border, transparent, scrim, scrimColor, scrollY: externalScrollY, scrollThreshold, sticky, safeArea, style, testID, }: PageHeaderProps): import("react/jsx-runtime").JSX.Element;
+declare function PageHeaderComponent({ title, subtitle, titleAlign, headingLevel, titleReveal, titleRevealOffset, presentation, placement, onBack, backLabel, leading, actions, border, transparent, scrim, scrimColor, scrollY: externalScrollY, scrollThreshold, sticky, safeArea, style, testID, }: PageHeaderProps): import("react/jsx-runtime").JSX.Element;
 export declare const PageHeader: React.MemoExoticComponent<typeof PageHeaderComponent>;
 export {};
 //# sourceMappingURL=PageHeader.d.ts.map

package/lib/typescript/module/page-header/PageHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../../../src/page-header/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AA8B9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA8E/C,iBAAS,mBAAmB,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,UAAoB,EACpB,YAAgB,EAChB,WAAsB,EACtB,YAAyB,EACzB,SAAoB,EACpB,MAAM,EACN,SAAkB,EAClB,OAAO,EACP,OAAO,EACP,MAAe,EACf,WAAmB,EACnB,KAAc,EACd,UAAU,EACV,OAAO,EAAE,eAAe,EACxB,eAAmC,EACnC,MAAa,EACb,QAAQ,EACR,KAAK,EACL,MAAM,GACP,EAAE,eAAe,2CA8SjB;AAuED,eAAO,MAAM,UAAU,uDAA4B,CAAC"}
+{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../../../src/page-header/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAiC9E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA8E/C,iBAAS,mBAAmB,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,UAAoB,EACpB,YAAgB,EAChB,WAAsB,EACtB,iBAAqB,EACrB,YAAyB,EACzB,SAAoB,EACpB,MAAM,EACN,SAAkB,EAClB,OAAO,EACP,OAAO,EACP,MAAe,EACf,WAAmB,EACnB,KAAc,EACd,UAAU,EACV,OAAO,EAAE,eAAe,EACxB,eAAmC,EACnC,MAAa,EACb,QAAQ,EACR,KAAK,EACL,MAAM,GACP,EAAE,eAAe,2CA2TjB;AAuED,eAAO,MAAM,UAAU,uDAA4B,CAAC"}

package/lib/typescript/module/page-header/types.d.ts

@@ -72,6 +72,8 @@ export interface PageHeaderProps {
     headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
     /** Default `always`. */
     titleReveal?: PageHeaderTitleReveal;
+    /** Scroll distance before title and subtitle begin revealing. Default0; fade spans scrollThreshold. */
+    titleRevealOffset?: number;
     /** Default `floating`. */
     presentation?: PageHeaderPresentation;
     /** Default `inline`. */

package/lib/typescript/module/page-header/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/page-header/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,0EAA0E;AAC1E,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEtD;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,KAAK,CAAC;AAExD;;;;;;;;;;;;;GAaG;AACH,MAAM,MAAM,mBAAmB,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEvD;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE1D;;;;;;;;GAQG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AAEzD;;;;;;;;;;GAUG;AACH,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE1D,MAAM,WAAW,eAAe;IAC9B,0FAA0F;IAC1F,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kFAAkF;IAClF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uBAAuB;IACvB,UAAU,CAAC,EAAE,oBAAoB,CAAC;IAClC,4CAA4C;IAC5C,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC,wBAAwB;IACxB,WAAW,CAAC,EAAE,qBAAqB,CAAC;IAEpC,0BAA0B;IAC1B,YAAY,CAAC,EAAE,sBAAsB,CAAC;IACtC,wBAAwB;IACxB,SAAS,CAAC,EAAE,mBAAmB,CAAC;IAEhC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,4EAA4E;IAC5E,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB,iDAAiD;IACjD,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sDAAsD;IACtD,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB;;;;;;;;;;;;;;OAcG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9B,sFAAsF;IACtF,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/page-header/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,0EAA0E;AAC1E,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEtD;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,KAAK,CAAC;AAExD;;;;;;;;;;;;;GAaG;AACH,MAAM,MAAM,mBAAmB,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEvD;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE1D;;;;;;;;GAQG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AAEzD;;;;;;;;;;GAUG;AACH,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE1D,MAAM,WAAW,eAAe;IAC9B,0FAA0F;IAC1F,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kFAAkF;IAClF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uBAAuB;IACvB,UAAU,CAAC,EAAE,oBAAoB,CAAC;IAClC,4CAA4C;IAC5C,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC,wBAAwB;IACxB,WAAW,CAAC,EAAE,qBAAqB,CAAC;IACpC,uGAAuG;IACvG,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B,0BAA0B;IAC1B,YAAY,CAAC,EAAE,sBAAsB,CAAC;IACtC,wBAAwB;IACxB,SAAS,CAAC,EAAE,mBAAmB,CAAC;IAEhC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,4EAA4E;IAC5E,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB,iDAAiD;IACjD,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sDAAsD;IACtD,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB;;;;;;;;;;;;;;OAcG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9B,sFAAsF;IACtF,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/lib/typescript/module/payment-method/PaymentMethodList.d.ts

@@ -0,0 +1,48 @@
+import React from 'react';
+import type { PaymentMethodListProps } from './types';
+/**
+ * The saved methods, with the default marked, an add row, an empty state and a
+ * loading state.
+ *
+ * THE VARIANT IS THE ANNOUNCED TREE, not a style. `list` is a set of methods a
+ * reader is managing: a `list` of `listitem`s, each wrapping a button. `picker`
+ * is a set they are choosing ONE of: a `radiogroup` of `radio`s carrying
+ * `aria-checked`. Both roles exist on both platforms, which is why the picker
+ * is a radio group rather than the listbox ARIA would suggest — React Native
+ * has no `listbox`, and a role that reaches one platform is the silent half of
+ * an accessibility bug.
+ *
+ * ## The picker is a `Field` MEMBER, not a hand-rolled radiogroup
+ *
+ * It resolves `useFieldMembership()` the way `RadioGroup` does, so a `Field`
+ * around it names the group, describes it with its error, marks it invalid and
+ * disables every row — and a row inside a disabled field cannot re-enable
+ * itself, because `disabled` combines with `||` rather than deferring.
+ *
+ * That is the difference between this and the three families `docs/composition.mdx`
+ * records as an open gap: writing `role="radiogroup"` is the easy half, and a
+ * group nothing can name or disable is what is left when it is the only half
+ * done.
+ *
+ * `accessibilityLabel` is the caller's and wins; the field's label is next;
+ * `"Payment methods"` is the last resort, and it is a LAST resort rather than a
+ * default because a default here would outrank the one string on screen the
+ * user can actually read.
+ *
+ * ## The add row is not one of the choices
+ *
+ * "Add a payment method" is an action, not a method, so it is drawn OUTSIDE the
+ * `radiogroup`. A `button` among the radios would be announced as part of the
+ * choice and counted in "3 of 4".
+ *
+ *   rows     4 apart, at the row's own geometry
+ *   loading  placeholder rows at the plate's own size, announced busy so a
+ *            reader is told to wait rather than told nothing
+ *   empty    a 32 glyph, a title and a line, centred with 32 of air — and the
+ *            add row is still drawn under it, because an empty list is exactly
+ *            when a reader needs it
+ */
+declare function PaymentMethodListComponent({ methods, selectedId, onSelect, variant, density, disabled, onAdd, addLabel, addIcon: AddIcon, loading, loadingRows, empty, emptyTitle, emptyDescription, emptyIcon: EmptyIcon, accessibilityLabel, style, testID, }: PaymentMethodListProps): import("react/jsx-runtime").JSX.Element;
+export declare const PaymentMethodList: React.MemoExoticComponent<typeof PaymentMethodListComponent>;
+export {};
+//# sourceMappingURL=PaymentMethodList.d.ts.map

package/lib/typescript/module/payment-method/PaymentMethodList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentMethodList.d.ts","sourceRoot":"","sources":["../../../../src/payment-method/PaymentMethodList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAc1D,OAAO,KAAK,EAAsB,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAY1E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,iBAAS,0BAA0B,CAAC,EAClC,OAAO,EACP,UAAU,EACV,QAAQ,EACR,OAAgB,EAChB,OAAuB,EACvB,QAAgB,EAChB,KAAK,EACL,QAAiC,EACjC,OAAO,EAAE,OAAmB,EAC5B,OAAe,EACf,WAAe,EACf,KAAK,EACL,UAAuC,EACvC,gBAAgB,EAChB,SAAS,EAAE,SAA0B,EACrC,kBAAkB,EAClB,KAAK,EACL,MAAM,GACP,EAAE,sBAAsB,2CA4KxB;AAED,eAAO,MAAM,iBAAiB,8DAAmC,CAAC"}

package/lib/typescript/module/payment-method/PaymentMethodMark.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import type { PaymentMethodMarkProps } from './types';
+/**
+ * The brand mark — and Bloom's is deliberately NOT a brand.
+ *
+ * **This never draws a scheme's logo, and it ships no list of schemes.** What it
+ * draws is a plate the shape of a card, a neutral glyph on it, and — when the
+ * caller gives one — the scheme's NAME as text beside it. Bloom does not know
+ * what schemes exist, is not licensed to reproduce their artwork, and a library
+ * that shipped twelve logos would be a library that quietly took on the
+ * trademark question for every app using it.
+ *
+ * An app that HAS the rights passes `image`: it is drawn inside the plate, at
+ * the plate's geometry, and everything else stays the same. That is the whole
+ * escape hatch, and it belongs to the app because the rights do.
+ *
+ *   plate    40 x 28, radius 6 (compact 32 x 22, radius 5), one surface step
+ *            off whatever is behind it — wider than tall is what reads as a
+ *            card rather than an app tile
+ *   glyph    18 in the secondary text rung (compact 14)
+ *   name     body-2-medium, 8 after the plate
+ *   state    `expired`/`declined` paint the plate in the state's tint, so a
+ *            row that cannot be used says so before its words are read
+ */
+declare function PaymentMethodMarkComponent({ scheme, kind, icon, image, state, density, style, testID, }: PaymentMethodMarkProps): import("react/jsx-runtime").JSX.Element;
+export declare const PaymentMethodMark: React.MemoExoticComponent<typeof PaymentMethodMarkComponent>;
+export {};
+//# sourceMappingURL=PaymentMethodMark.d.ts.map

package/lib/typescript/module/payment-method/PaymentMethodMark.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentMethodMark.d.ts","sourceRoot":"","sources":["../../../../src/payment-method/PaymentMethodMark.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAc7C,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAEtD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,iBAAS,0BAA0B,CAAC,EAClC,MAAM,EACN,IAAa,EACb,IAAI,EACJ,KAAK,EACL,KAAY,EACZ,OAAuB,EACvB,KAAK,EACL,MAAM,GACP,EAAE,sBAAsB,2CAuDxB;AAED,eAAO,MAAM,iBAAiB,8DAAmC,CAAC"}

package/lib/typescript/module/payment-method/PaymentMethodRow.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import type { PaymentMethodRowProps } from './types';
+/**
+ * A way to pay, as a row: the mark, the scheme, the masked identifier, when it
+ * runs out, whether it is the default one, and either a trailing action or a
+ * selection control.
+ *
+ * It is `Item` with a payment method's slots filled in, for the same reason
+ * `AddressRow` is: the row, the press target, the selected wash, the density
+ * rungs, the disabled opacity and the ARIA role translation are `Item`'s job,
+ * and this family owns no second copy of any of them. What it adds is the card
+ * plate, the scheme/masked pairing on the title line, the default badge, the
+ * state line and the radio dot.
+ *
+ *   mark     `PaymentMethodMark`, plate only — the row draws the name itself,
+ *            so the title line can hold the masked tail and the badge too
+ *   title    scheme in `Item`'s own title rung; the masked identifier beside it
+ *            in body-2 TABULAR figures, so four rows of digits line up
+ *   line 2   the expiry, secondary
+ *   line 3   the state's words in the state's own colour, drawn only when the
+ *            method cannot be used
+ *   trailing the radio dot (`selectable`) or the action
+ *
+ * NOTHING HERE IS SENSITIVE. `masked` is a string the app already masked; this
+ * row never unmasks, parses, stores, logs or transmits anything, and there is no
+ * prop that takes a full number.
+ */
+declare function PaymentMethodRowComponent({ scheme, masked, expiry, kind, icon, image, leading, isDefault, defaultLabel, state, stateMessage, selectable, selected, action, onPress, disabled, density, role, accessibilityLabel, style, testID, }: PaymentMethodRowProps): import("react/jsx-runtime").JSX.Element;
+export declare const PaymentMethodRow: React.MemoExoticComponent<typeof PaymentMethodRowComponent>;
+export {};
+//# sourceMappingURL=PaymentMethodRow.d.ts.map

package/lib/typescript/module/payment-method/PaymentMethodRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentMethodRow.d.ts","sourceRoot":"","sources":["../../../../src/payment-method/PaymentMethodRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAc7C,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,iBAAS,yBAAyB,CAAC,EACjC,MAAM,EACN,MAAM,EACN,MAAM,EACN,IAAa,EACb,IAAI,EACJ,KAAK,EACL,OAAO,EACP,SAAiB,EACjB,YAAwB,EACxB,KAAY,EACZ,YAAY,EACZ,UAAkB,EAClB,QAAQ,EACR,MAAM,EACN,OAAO,EACP,QAAgB,EAChB,OAAuB,EACvB,IAAI,EACJ,kBAAkB,EAClB,KAAK,EACL,MAAM,GACP,EAAE,qBAAqB,2CA+IvB;AAED,eAAO,MAAM,gBAAgB,6DAAkC,CAAC"}

package/lib/typescript/module/payment-method/constants.d.ts

@@ -0,0 +1,35 @@
+import type { BloomIconComponent } from '../icons/icon-component';
+import type { AccentTone } from '../theme/accent-colors';
+import type { PaymentMethodDensity, PaymentMethodKind, PaymentMethodState } from './types';
+/** The glyph each kind draws when the caller names none. */
+export declare const PAYMENT_METHOD_KIND_ICON: Record<PaymentMethodKind, BloomIconComponent>;
+/** What the row says under itself when a state has no message of its own. */
+export declare const PAYMENT_METHOD_STATE_LABELS: Record<PaymentMethodState, string>;
+/**
+ * The tone each state paints. `ok` paints nothing — an ordinary row is not a
+ * status.
+ */
+export declare const PAYMENT_METHOD_STATE_TONE: Record<PaymentMethodState, AccentTone | undefined>;
+export interface PaymentMethodGeometry {
+    /** The plate the glyph sits on: wider than tall, which is what says "card". */
+    plateWidth: number;
+    plateHeight: number;
+    plateRadius: number;
+    /** The glyph inside it. */
+    glyph: number;
+    /** The radio dot in the trailing slot. */
+    dot: number;
+}
+/**
+ * 40 wide is the leading column `Item` rows across the library already use
+ * (`address`'s tile is 40 round), so a checkout screen stacking an address row
+ * and a payment row does not step sideways between them. 28 tall against 40
+ * wide is the ratio that reads as a card rather than a square tile, and it is
+ * the one measurement in this family that is about SHAPE rather than size.
+ */
+export declare const PAYMENT_METHOD_GEOMETRY: Record<PaymentMethodDensity, PaymentMethodGeometry>;
+/** Space between the plate and the name, inside a `PaymentMethodMark`. */
+export declare const PAYMENT_METHOD_MARK_GAP = 8;
+/** Space between the rows of a list, and between the list and its add row. */
+export declare const PAYMENT_METHOD_LIST_GAP = 4;
+//# sourceMappingURL=constants.d.ts.map

package/lib/typescript/module/payment-method/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/payment-method/constants.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,KAAK,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE3F,4DAA4D;AAC5D,eAAO,MAAM,wBAAwB,EAAE,MAAM,CAAC,iBAAiB,EAAE,kBAAkB,CAKlF,CAAC;AAEF,6EAA6E;AAC7E,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAAC,kBAAkB,EAAE,MAAM,CAI1E,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,yBAAyB,EAAE,MAAM,CAAC,kBAAkB,EAAE,UAAU,GAAG,SAAS,CAIxF,CAAC;AAEF,MAAM,WAAW,qBAAqB;IACpC,+EAA+E;IAC/E,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,2BAA2B;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,0CAA0C;IAC1C,GAAG,EAAE,MAAM,CAAC;CACb;AAED;;;;;;GAMG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,oBAAoB,EAAE,qBAAqB,CAGvF,CAAC;AAEF,0EAA0E;AAC1E,eAAO,MAAM,uBAAuB,IAAI,CAAC;AAEzC,8EAA8E;AAC9E,eAAO,MAAM,uBAAuB,IAAI,CAAC"}

package/lib/typescript/module/payment-method/index.d.ts

@@ -0,0 +1,9 @@
+export { PaymentMethodList } from './PaymentMethodList';
+export { PaymentMethodMark } from './PaymentMethodMark';
+export { PaymentMethodRow } from './PaymentMethodRow';
+export { PAYMENT_METHOD_GEOMETRY, PAYMENT_METHOD_KIND_ICON, PAYMENT_METHOD_LIST_GAP, PAYMENT_METHOD_MARK_GAP, PAYMENT_METHOD_STATE_LABELS, PAYMENT_METHOD_STATE_TONE, } from './constants';
+export type { PaymentMethodGeometry } from './constants';
+export { composePaymentMethodName, paymentMethodStateMessage, resolvePaymentMethodPaint } from './shared';
+export type { PaymentMethodPaint } from './shared';
+export type { PaymentMethodDensity, PaymentMethodEntry, PaymentMethodKind, PaymentMethodListProps, PaymentMethodListVariant, PaymentMethodMarkProps, PaymentMethodRowProps, PaymentMethodState, } from './types';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/payment-method/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/payment-method/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EACL,uBAAuB,EACvB,wBAAwB,EACxB,uBAAuB,EACvB,uBAAuB,EACvB,2BAA2B,EAC3B,yBAAyB,GAC1B,MAAM,aAAa,CAAC;AACrB,YAAY,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAC;AACzD,OAAO,EAAE,wBAAwB,EAAE,yBAAyB,EAAE,yBAAyB,EAAE,MAAM,UAAU,CAAC;AAC1G,YAAY,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AACnD,YAAY,EACV,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EACjB,sBAAsB,EACtB,wBAAwB,EACxB,sBAAsB,EACtB,qBAAqB,EACrB,kBAAkB,GACnB,MAAM,SAAS,CAAC"}

package/lib/typescript/module/payment-method/shared.d.ts

@@ -0,0 +1,27 @@
+/**
+ * What a payment-method row paints, read RELATIVE to the surface it was dropped
+ * on (`styles/surface-levels.ts`) — a saved-methods screen sits on the page, a
+ * checkout picker sits in a card and a sheet's picker sits two rungs up, and a
+ * plate colour picked by eye disappears on one of the three.
+ *
+ * Pure, so `PaymentMethod.test.tsx` can walk presets and modes without
+ * rendering.
+ */
+import { type SurfaceTextPaint } from '../styles/surface-levels';
+import type { Theme } from '../theme/types';
+import type { PaymentMethodState } from './types';
+export interface PaymentMethodPaint extends SurfaceTextPaint {
+    /** The plate the mark's glyph sits on — one step off whatever is behind the row. */
+    plate: string;
+}
+export declare function resolvePaymentMethodPaint(theme: Theme, surface: string): PaymentMethodPaint;
+/** Joins the non-empty parts of an accessible name, in reading order. */
+export declare function composePaymentMethodName(parts: ReadonlyArray<string | false | null | undefined>, separator?: string): string;
+/**
+ * The words a state says when the caller gave no message.
+ *
+ * `ok` has none: an ordinary method is not a status, and a row that said "OK"
+ * under every card would be noise a reader has to read past four times.
+ */
+export declare function paymentMethodStateMessage(state: PaymentMethodState, message?: string): string | undefined;
+//# sourceMappingURL=shared.d.ts.map

package/lib/typescript/module/payment-method/shared.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../../../src/payment-method/shared.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,OAAO,EAAgC,KAAK,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAC/F,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAE5C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,MAAM,WAAW,kBAAmB,SAAQ,gBAAgB;IAC1D,oFAAoF;IACpF,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,GAAG,kBAAkB,CAK3F;AAED,yEAAyE;AACzE,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,aAAa,CAAC,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC,EACvD,SAAS,SAAO,GACf,MAAM,CAIR;AAED;;;;;GAKG;AACH,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,kBAAkB,EACzB,OAAO,CAAC,EAAE,MAAM,GACf,MAAM,GAAG,SAAS,CAIpB"}

package/lib/typescript/module/payment-method/types.d.ts

@@ -0,0 +1,181 @@
+import type { ReactNode } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { BloomIconComponent } from '../icons/icon-component';
+/**
+ * WHAT KIND OF THING PAYS — data, not four components.
+ *
+ * It chooses the default glyph on the mark and nothing else: a card, a bank
+ * account the charge is drawn from, a stored balance, or money handed over at
+ * the door. An app whose kinds are not these four passes `icon`.
+ */
+export type PaymentMethodKind = 'card' | 'account' | 'wallet' | 'cash';
+/**
+ * Whether the method can still be used.
+ *
+ * `ok` is the ordinary case. `expired` and `declined` are the two an app has to
+ * be able to draw, and they are STATES rather than tones: the row picks the
+ * warning/error paint itself so two screens cannot disagree about which colour
+ * a declined card is.
+ */
+export type PaymentMethodState = 'ok' | 'expired' | 'declined';
+export type PaymentMethodDensity = 'comfortable' | 'compact';
+/**
+ * `list` is a set of saved methods a reader is managing; `picker` is a set they
+ * are choosing ONE of. The difference is the announced tree — a `radiogroup` of
+ * `radio`s against a `list` of `listitem`s — which is why it is a variant and
+ * not a styling prop.
+ */
+export type PaymentMethodListVariant = 'list' | 'picker';
+/**
+ * The brand mark.
+ *
+ * **Bloom never draws a brand's logo.** The mark is a neutral glyph on a plate
+ * the shape of a card, and the scheme's NAME as text beside it. An app that has
+ * the rights to a logo passes it as `image`, which replaces the glyph — the
+ * plate, the geometry and the name stay Bloom's.
+ */
+export interface PaymentMethodMarkProps {
+    /**
+     * The scheme's name, spelled by the APP — Bloom ships no list of schemes.
+     * Drawn as text beside the plate. Omit it for the plate alone, which is what
+     * `PaymentMethodRow` does: the row already draws the name in its title.
+     */
+    scheme?: string;
+    /** Chooses the default glyph. Default `card`. */
+    kind?: PaymentMethodKind;
+    /** The glyph, overriding whatever `kind` would have chosen. */
+    icon?: BloomIconComponent;
+    /**
+     * An image the app has the rights to, drawn inside the plate instead of the
+     * glyph. Read for PRESENCE, so `image={null}` is an empty plate rather than
+     * the glyph.
+     */
+    image?: ReactNode;
+    /** Paints the plate in the state's tone. Default `ok`. */
+    state?: PaymentMethodState;
+    /** Default `comfortable`. */
+    density?: PaymentMethodDensity;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+export interface PaymentMethodRowProps {
+    /** The scheme's name, spelled by the app — "Aurora", "Meridian". */
+    scheme?: string;
+    /**
+     * The MASKED identifier — `"•••• 4417"`, `"ES•• •••• 8842"`, `"nil@example"`.
+     *
+     * The app masks it. Nothing in this family unmasks, parses, stores or
+     * transmits anything, and a full number should never reach this prop.
+     */
+    masked?: string;
+    /**
+     * Pre-formatted by the app: `"09/29"`, `"Expires 09/29"`. Bloom never reads a
+     * clock, so whether that date is in the past is the app's finding, reported
+     * through `state`.
+     */
+    expiry?: string;
+    /** Chooses the default glyph on the mark. Default `card`. */
+    kind?: PaymentMethodKind;
+    /** The glyph, overriding whatever `kind` would have chosen. */
+    icon?: BloomIconComponent;
+    /** An image the app has the rights to, drawn inside the plate. */
+    image?: ReactNode;
+    /**
+     * An arbitrary leading node instead of the mark. Read for PRESENCE:
+     * `leading={null}` draws no media at all.
+     */
+    leading?: ReactNode;
+    /** Marks this as the one that will be charged. Draws a `Badge`. */
+    isDefault?: boolean;
+    /** The default badge's word. Default `"Default"`. */
+    defaultLabel?: string;
+    /** Default `ok`. */
+    state?: PaymentMethodState;
+    /**
+     * The words under the row when `state` is not `ok` — "Declined by your bank",
+     * "This card expired in June". Without it the row draws the state's own
+     * label.
+     */
+    stateMessage?: string;
+    /**
+     * Draws the radio dot in the trailing slot and announces the row as a
+     * `radio`. `PaymentMethodList variant="picker"` sets it; set it yourself only
+     * for a row inside a `radiogroup` of your own.
+     */
+    selectable?: boolean;
+    /** Whether this is the chosen one. Announced as `aria-checked` on a `radio`. */
+    selected?: boolean;
+    /**
+     * A trailing control — a `GlyphButton` with the row's menu, a `Button`.
+     *
+     * A PRESSABLE row cannot nest one: on web the row is a real `<button>`, so
+     * the action is drawn beside the row instead of inside it. See `AddressRow`,
+     * where the same rule is measured.
+     */
+    action?: ReactNode;
+    onPress?: () => void;
+    disabled?: boolean;
+    /** Default `comfortable`. */
+    density?: PaymentMethodDensity;
+    /**
+     * What the row IS in the tree around it. `PaymentMethodList` passes this; a
+     * row on its own leaves it alone and gets a plain pressable row.
+     */
+    role?: 'radio' | 'option' | 'listitem';
+    /**
+     * The announced name. Defaults to the scheme, the masked identifier, the
+     * default mark and the state, joined — the row's own text in reading order.
+     */
+    accessibilityLabel?: string;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/** One saved method, as data. */
+export interface PaymentMethodEntry extends Omit<PaymentMethodRowProps, 'onPress' | 'selected' | 'selectable' | 'role'> {
+    /** Identifies the entry to `onSelect` and `selectedId`. */
+    id: string;
+}
+export interface PaymentMethodListProps {
+    /** The saved methods, in the order they should be read. */
+    methods: readonly PaymentMethodEntry[];
+    /** The chosen entry's `id`. Only meaningful for `variant="picker"`. */
+    selectedId?: string;
+    onSelect?: (id: string) => void;
+    /** Default `list`. */
+    variant?: PaymentMethodListVariant;
+    /** Default `comfortable`. */
+    density?: PaymentMethodDensity;
+    /**
+     * Disables every row. Combined with an enclosing `Field`'s `disabled` with
+     * `||`, never replaced — a row inside a disabled field cannot re-enable
+     * itself.
+     */
+    disabled?: boolean;
+    /** Draws the "add a method" row under the list. Without it no row is drawn. */
+    onAdd?: () => void;
+    /** Default `"Add a payment method"`. */
+    addLabel?: string;
+    /** The glyph on the add row. Default a plus. */
+    addIcon?: BloomIconComponent;
+    /** Draws placeholder rows instead of the methods. */
+    loading?: boolean;
+    /** How many placeholder rows. Default 3. */
+    loadingRows?: number;
+    /** Replaces the whole empty block. The add row is still drawn under it. */
+    empty?: ReactNode;
+    /** Default `"No saved payment methods"`. */
+    emptyTitle?: string;
+    emptyDescription?: string;
+    /** The glyph above the empty text. Default a card. */
+    emptyIcon?: BloomIconComponent;
+    /**
+     * Names the list — and, for a picker, the `radiogroup`.
+     *
+     * Inside a `Field` the field's label supplies it; this wins when both are
+     * given. `"Payment methods"` is the last resort.
+     */
+    accessibilityLabel?: string;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/lib/typescript/module/payment-method/types.d.ts.map

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

package/lib/typescript/module/payment-status/PaymentStatusBar.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import type { PaymentStatusBarProps } from './types';
+/**
+ * The compact live strip: what happened to the money, how much, and one action.
+ *
+ * ## It IS `OrderStatusBar`
+ *
+ * Not a second strip that looks like it. `order-status` already owns the
+ * library's answer to "where is this right now": the 40 tile in the tone's
+ * tint, the one-line status with a short trailing reading in tabular figures, a
+ * quiet second line, a `Meter` for progress, the surface-relative chrome and
+ * the `plain` variant for a strip already inside a card. A payment is the same
+ * question with different data, and shipping a second strip would mean two
+ * components drifting apart on every one of those decisions.
+ *
+ * What this adds is the mapping a payment needs and an order does not: five
+ * states to five sets of words, five tones and five glyphs, in one place
+ * (`constants.ts`) so a status row and a confirmation screen cannot disagree
+ * about what "pending" is called or what colour it is.
+ *
+ * ## The amount rides the trailing reading
+ *
+ * `OrderStatusBar`'s trailing slot is a short reading in tabular figures,
+ * capped so it cannot crush the status beside it — which is exactly what an
+ * amount is. Its PROP is spelled `eta`, because an order was the first thing
+ * that needed it; the slot is general and this is the second. That naming is
+ * worth fixing in `order-status`, and it is that family's to fix.
+ *
+ * Nothing here formats money: `amount` is a string the app already formatted.
+ */
+declare function PaymentStatusBarComponent({ state, status, amount, detail, progress, icon, action, variant, labels, style, testID, }: PaymentStatusBarProps): import("react/jsx-runtime").JSX.Element;
+export declare const PaymentStatusBar: React.MemoExoticComponent<typeof PaymentStatusBarComponent>;
+export {};
+//# sourceMappingURL=PaymentStatusBar.d.ts.map

package/lib/typescript/module/payment-status/PaymentStatusBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentStatusBar.d.ts","sourceRoot":"","sources":["../../../../src/payment-status/PaymentStatusBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,iBAAS,yBAAyB,CAAC,EACjC,KAAK,EACL,MAAM,EACN,MAAM,EACN,MAAM,EACN,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,OAAmB,EACnB,MAAM,EACN,KAAK,EACL,MAAM,GACP,EAAE,qBAAqB,2CAiBvB;AAED,eAAO,MAAM,gBAAgB,6DAAkC,CAAC"}

package/lib/typescript/module/payment-status/PaymentStatusBlock.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import type { PaymentStatusBlockProps } from './types';
+/**
+ * The block form: a confirmation screen's answer, not a row's.
+ *
+ * `PaymentStatusBar` is the strip a list, a header or a sticky footer carries
+ * while something is in progress. This is the thing a reader ARRIVES at — so
+ * the glyph is the page's subject rather than a row's ornament, the amount is
+ * the largest thing on it, and the failure's words get an `Admonition` of their
+ * own rather than a second line.
+ *
+ *   tile     56 round in the state's tint, a 28 glyph in the tone's own accent
+ *   status   title-2-semibold, centred
+ *   amount   title-1-semibold in TABULAR figures — the number a reader checks
+ *   detail   body-regular, secondary
+ *   ref      caption-1-medium label over a body-medium tabular value, so a
+ *            reference can be read out one character at a time
+ *   reason   `Admonition`, error for a failure and warning for a pending one.
+ *            The three states with nothing to explain draw none, whatever
+ *            `reason` says — a reason under a success is a reader hunting for a
+ *            problem that is not there.
+ *   surface  one rung above whatever it was dropped on, 16 radius, a hairline;
+ *            `plain` draws the content and no chrome
+ *
+ * Nothing here formats money, reads a clock or decides what a processor's
+ * status means.
+ */
+declare function PaymentStatusBlockComponent({ state, status, amount, detail, reference, referenceLabel, reason, actions, icon, variant, labels, accessibilityLabel, style, testID, }: PaymentStatusBlockProps): import("react/jsx-runtime").JSX.Element;
+export declare const PaymentStatusBlock: React.MemoExoticComponent<typeof PaymentStatusBlockComponent>;
+export {};
+//# sourceMappingURL=PaymentStatusBlock.d.ts.map

package/lib/typescript/module/payment-status/PaymentStatusBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentStatusBlock.d.ts","sourceRoot":"","sources":["../../../../src/payment-status/PaymentStatusBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAgB7C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAOvD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,iBAAS,2BAA2B,CAAC,EACnC,KAAK,EACL,MAAM,EACN,MAAM,EACN,MAAM,EACN,SAAS,EACT,cAA4B,EAC5B,MAAM,EACN,OAAO,EACP,IAAI,EACJ,OAAmB,EACnB,MAAM,EACN,kBAAkB,EAClB,KAAK,EACL,MAAM,GACP,EAAE,uBAAuB,2CAkHzB;AAED,eAAO,MAAM,kBAAkB,+DAAoC,CAAC"}