themelia-react-ui 2.0.0 → 2.0.2

package/dist/components/base/signature-pad/signature-pad.utils.d.ts

@@ -2,7 +2,15 @@ import type { SignaturePadValue } from './signature-pad.types';
 export declare const emptySignature: SignaturePadValue;
 export declare function isSignatureEmpty(value: SignaturePadValue): boolean;
 export declare function normalizeSignature(value: SignaturePadValue): SignaturePadValue;
+/**
+ * A typed name is drawn in the field's own font family: the theme sans unless the
+ * consumer sets a font on the pad. This fallback applies only outside the DOM.
+ */
+export declare const signatureFallbackFont = "sans-serif";
 /** Drawing geometry, separate from structural UI spacing and theme tokens. */
-export declare function drawSignature(context: CanvasRenderingContext2D, value: SignaturePadValue, width: number, height: number, strokeWidth: number): void;
-/** Semantic currentColor is preserved unless a resolved export ink is supplied. */
-export declare function signaturePadToSVG(value: SignaturePadValue, width?: number, height?: number, strokeWidth?: number, ink?: string): string;
+export declare function drawSignature(context: CanvasRenderingContext2D, value: SignaturePadValue, width: number, height: number, strokeWidth: number, fontFamily?: string): void;
+/**
+ * Semantic currentColor is preserved unless a resolved export ink is supplied. The
+ * typed name uses `fontFamily`, which SignaturePad resolves from its rendered font.
+ */
+export declare function signaturePadToSVG(value: SignaturePadValue, width?: number, height?: number, strokeWidth?: number, ink?: string, fontFamily?: string): string;

package/dist/components/base/table/index.d.ts

@@ -1,6 +1,13 @@
 import * as React from 'react';
 import { Table as UITable, TableBody as UITableBody, TableCaption as UITableCaption, TableCell as UITableCell, TableFooter as UITableFooter, TableHead as UITableHead, TableHeader as UITableHeader, TableRow as UITableRow } from '../../ui/table';
-export type TableProps = React.ComponentProps<typeof UITable>;
+import { type RowDensity } from '../../../lib/row-recipes';
+export type TableProps = React.ComponentProps<typeof UITable> & {
+    /**
+     * Vertical row rhythm for every header and body cell. Header cells sit one
+     * row step above their body rows. Defaults to `default`.
+     */
+    density?: RowDensity;
+};
 export type TableHeaderProps = React.ComponentProps<typeof UITableHeader>;
 export type TableBodyProps = React.ComponentProps<typeof UITableBody>;
 export type TableFooterProps = React.ComponentProps<typeof UITableFooter>;
@@ -8,7 +15,7 @@ export type TableRowProps = React.ComponentProps<typeof UITableRow>;
 export type TableHeadProps = React.ComponentProps<typeof UITableHead>;
 export type TableCellProps = React.ComponentProps<typeof UITableCell>;
 export type TableCaptionProps = React.ComponentProps<typeof UITableCaption>;
-export declare function Table({ className, containerClassName, containerProps, ...props }: TableProps): React.JSX.Element;
+export declare function Table({ className, containerClassName, containerProps, density, ...props }: TableProps): React.JSX.Element;
 export declare function TableHeader({ className, ...props }: TableHeaderProps): React.JSX.Element;
 export declare function TableBody({ className, ...props }: TableBodyProps): React.JSX.Element;
 export declare function TableFooter({ className, ...props }: TableFooterProps): React.JSX.Element;

package/dist/components/base/text-inputs/field-clear-button.d.ts

@@ -0,0 +1,6 @@
+/**
+ * The inline clear action shared by Input, Textarea and Cascader: a native button
+ * drawing the shared clear target, focus edge and glyph. Its owner places it and
+ * supplies the accessible name, handler and disabled state.
+ */
+export declare const FieldClearButton: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/components/base/text-inputs/input-group.d.ts

@@ -21,7 +21,7 @@
 import type { ComponentProps } from 'react';
 import { InputGroup as InputGroupPrimitive, InputGroupAddon as InputGroupAddonPrimitive, InputGroupInput as InputGroupInputPrimitive, InputGroupText as InputGroupTextPrimitive, InputGroupTextarea as InputGroupTextareaPrimitive } from '../../ui/input-group';
 import { type ButtonProps } from '../buttons';
-import type { ComponentScale } from '../../../lib/ui-provider';
+import { type ComponentScale } from '../../../lib/ui-provider';
 export type InputGroupProps = ComponentProps<typeof InputGroupPrimitive>;
 export type InputGroupAddonProps = ComponentProps<typeof InputGroupAddonPrimitive>;
 export interface InputGroupButtonProps extends Omit<ButtonProps, 'size'> {
@@ -36,7 +36,7 @@ declare function InputGroup({ className, ...props }: InputGroupProps): import("r
 /** Leading/trailing (or block start/end) affordance slot inside the frame. */
 declare function InputGroupAddon({ className, align, ...props }: InputGroupAddonProps): import("react").JSX.Element;
 /** Inline action button sized to sit inside the control frame; its label stays on one line. */
-declare function InputGroupButton({ className, tone, buttonStyle, truncate, ...props }: InputGroupButtonProps): import("react").JSX.Element;
+declare function InputGroupButton({ className, tone, buttonStyle, truncate, iconOnly, ...props }: InputGroupButtonProps): import("react").JSX.Element;
 /** Static copy segment — scalar text renders through Typography. */
 declare function InputGroupText({ children, className, ...props }: InputGroupTextProps): import("react").JSX.Element;
 /** Single-line control that inherits the group's frame instead of its own. */

package/dist/components/base/upload/upload.recipes.d.ts

@@ -1,11 +1,33 @@
 /**
  * Private drop-target states shared by Dropzone, AvatarUpload and ImageUpload.
- * An empty target draws the dashed `--input` control boundary (3:1 on every
- * surface), so all three upload targets read as the same kind of control.
- * Hover, drag and invalid states replace only the boundary colour and fill.
+ * An empty target draws the dashed `--input` control boundary, so all three
+ * upload targets read as the same kind of control as every field. Hover, drag
+ * and invalid states replace only the boundary colour and fill.
+ *
+ * Keyboard focus on the hidden file input draws the shared focus frame on the
+ * target (each owner adds the `ring-3` width). The valid and invalid colours are
+ * alternatives, never stacked, so an invalid target keeps its destructive border
+ * and tints the halo instead of tying with the ring colour.
  */
 export declare const uploadDropTargetRecipes: {
     readonly idle: "border-input";
     readonly invalid: "border-destructive";
+    readonly invalidHover: "hover:bg-destructive/5";
+    readonly invalidDragging: "border-destructive bg-destructive/5";
     readonly dragging: "border-primary bg-primary/10";
+    /** Pointer over an enabled target previews the drop: the boundary takes the primary colour. */
+    readonly hover: "hover:border-primary hover:bg-primary/5";
+    /** A file dragged over an already selected file row: the row keeps its edge and gains the tone halo. */
+    readonly draggingRing: "ring-3 ring-primary/30";
+    readonly invalidDraggingRing: "ring-3 ring-destructive/30";
+    readonly focus: {
+        readonly input: {
+            readonly valid: "has-[input:focus-visible]:border-ring has-[input:focus-visible]:ring-ring/50";
+            readonly invalid: "has-[input:focus-visible]:ring-destructive/30 dark:has-[input:focus-visible]:ring-destructive/50";
+        };
+        readonly filePicker: {
+            readonly valid: "has-[[data-slot=file-picker-input]:focus-visible]:border-ring has-[[data-slot=file-picker-input]:focus-visible]:ring-ring/50";
+            readonly invalid: "has-[[data-slot=file-picker-input]:focus-visible]:ring-destructive/30 dark:has-[[data-slot=file-picker-input]:focus-visible]:ring-destructive/50";
+        };
+    };
 };

package/dist/components/base/value-inputs/index.d.ts

@@ -7,10 +7,10 @@
  * (chips, country prefix menu, swatch and picker, track, calendar) rather than
  * a text box.
  *
- * This family composes the other two: the phone, colour and tags controls all
- * render `Input` from `base/text-inputs`, and the phone control renders the
- * shared `SelectPopup*` parts from `base/choice-inputs`. The dependency runs
- * one way only.
+ * This family composes the other two: the phone and colour controls render
+ * `Input` from `base/text-inputs`, the tags control draws the same field frame
+ * around its chips, and the phone control renders the shared `SelectPopup*`
+ * parts from `base/choice-inputs`. The dependency runs one way only.
  *
  * Related families:
  *   - `themelia-react-ui/base/text-inputs` — free-form text entry
@@ -18,7 +18,7 @@
  *   - `themelia-react-ui/base/forms-numeric` — money, weight, dimensions
  *   - `themelia-react-ui/base/date-pickers` — calendars and time pickers
  */
-export { TagsInput, type TagsInputProps } from './tags-input';
+export { TagsInput, defaultTagsInputStrings, type TagsInputProps, type TagsInputStrings, } from './tags-input';
 export { PhoneInput, defaultPhoneInputStrings, DEFAULT_COUNTRY_PREFIXES, COUNTRY_PREFIX_MAP, type PhoneInputProps, type PhoneInputStrings, type CountryPrefixOption, type CountryPrefixInput, } from './phone-input';
 export { ColorInput, defaultColorInputStrings, type ColorInputProps, type ColorInputStrings, } from './color-input';
 export { SliderField, defaultSliderStrings, type SliderProps, type SliderStrings, type SliderImitationEvent, } from './slider';

package/dist/components/base/value-inputs/tags-input.d.ts

@@ -10,49 +10,73 @@ export interface TagsInputStrings {
     summary: (current: number, max: number) => string;
     /** Accessible name of a tag's remove action. Defaults to `"Remove {tag}"`. */
     removeTag?: (tag: string) => string;
+    /**
+     * Announced when a commit leaves entries it could not add (too short or
+     * long, duplicate, refused by `validate`, or over `maxTags`). Receives the
+     * rejected entries joined with commas. Defaults to `"Not added: {entries}."`.
+     */
+    notAdded?: (entries: string) => string;
+    /** Accessible name of the recommendation list. Defaults to `"Suggested tags"`. */
+    recommendationsLabel?: string;
 }
 export declare const defaultTagsInputStrings: TagsInputStrings;
 export interface TagsInputProps<T = string> {
     /** ID of the editable input, for an external field label. */
     id?: string;
+    /** Names the editable input when no visible label points at it. */
+    'aria-label'?: string;
+    /** IDs of the elements that label the editable input. */
+    'aria-labelledby'?: string;
     /** Additional supporting/error descriptions associated with the editable control. */
     'aria-describedby'?: string;
-    /** Current value (array of T) */
+    /** Marks the field invalid, like `invalid`; a FormField or form library may inject it. */
+    'aria-invalid'?: boolean | 'true' | 'false';
+    /** Marks the editable input as required for assistive tech. */
+    'aria-required'?: boolean | 'true' | 'false';
+    /** Current value (array of T). Pass it to control the field. */
     value?: T[];
+    /** Initial value when uncontrolled. Ignored when `value` is set. */
+    defaultValue?: T[];
     /** Callback when value changes */
     onValueChange?: (value: T[]) => void;
-    /** Placeholder text for the input */
+    /** Form field name. Each tag is serialised as a hidden `name[]` input (its display value), disabled with the field. */
+    name?: string;
+    /** Placeholder text for the input, shown while there are no tags. */
     placeholder?: string;
     /** Array of recommendations to suggest */
     recommendations?: Array<T | {
         value: T;
         label: string;
     }>;
-    /** Maximum number of tags allowed */
+    /** Maximum number of tags allowed. Entry is refused and announced once it is reached; the input stays focusable. */
     maxTags?: number;
-    /** Show the label for the maximum tags */
+    /** Shows the `strings.summary` count under the field. Requires `maxTags`. */
     showMaxTags?: boolean;
     /** Whether duplicate tags are allowed */
     allowDuplicates?: boolean;
-    /** Custom validation function */
+    /** Custom validation function. Runs after the length, limit and duplicate checks. */
     validate?: (value: T) => boolean;
     /** Whether the input is disabled */
     disabled?: boolean;
-    /** Whether to show the clear all button */
+    /** Shows a clear-all action under the field while there are tags. */
     showClearAll?: boolean;
-    /** Custom tag component */
+    /**
+     * Custom tag component. `index` is the tag's position in the value, and
+     * `onRemove(index)` removes it and moves focus to the neighbouring remove
+     * action (an element with `data-tag-remove`), else the input.
+     */
     renderTag?: (tag: T, index: number, onRemove: (index: number) => void) => React.ReactNode;
-    /** Delimiter for separating tags when pasting */
+    /** Splits typed and pasted text into several tags. Defaults to a comma or a newline. */
     delimiter?: string | RegExp;
     /** Whether to trigger add on blur */
     addOnBlur?: boolean;
     /** Minimum length for a tag */
     minLength?: number;
-    /** Maximum length for a tag */
+    /** Maximum length for a tag. Longer entries are refused and announced, never truncated. */
     maxLength?: number;
-    /** Override default English strings (placeholder, empty list, clear-all). */
+    /** Override default English strings (placeholder, empty list, clear-all, announcements). */
     strings?: StringsProp<TagsInputStrings>;
-    /** Whether tags should be sorted */
+    /** Keeps the value sorted by display text as tags are added. */
     sortTags?: boolean;
     /** Case sensitivity for duplicate checking */
     caseSensitive?: boolean;
@@ -63,7 +87,7 @@ export interface TagsInputProps<T = string> {
     /** Additional class names */
     className?: string;
 }
-export declare function TagsInput<T = string>({ id, 'aria-describedby': ariaDescribedBy, value, onValueChange, placeholder, recommendations, maxTags, showMaxTags, allowDuplicates, validate, disabled, showClearAll, renderTag, delimiter, addOnBlur, minLength, maxLength, sortTags, caseSensitive, field, invalid, className, strings: stringsProp, }: TagsInputProps<T>): React.JSX.Element;
+export declare function TagsInput<T = string>({ id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-invalid': ariaInvalid, 'aria-required': ariaRequired, value, defaultValue, onValueChange, name, placeholder, recommendations, maxTags, showMaxTags, allowDuplicates, validate, disabled, showClearAll, renderTag, delimiter, addOnBlur, minLength, maxLength, sortTags, caseSensitive, field, invalid, className, strings: stringsProp, }: TagsInputProps<T>): React.JSX.Element;
 export declare namespace TagsInput {
     var displayName: string;
 }

package/dist/components/blocks/ai/ai-shimmer/ai-shimmer.d.ts

@@ -1,5 +1,5 @@
 import type { AiShimmerProps } from './types';
-export declare function AiShimmer({ children, paused, duration, className, }: AiShimmerProps): import("react").JSX.Element;
+export declare function AiShimmer({ children, paused, duration, size, className, }: AiShimmerProps): import("react").JSX.Element;
 export declare namespace AiShimmer {
     var displayName: string;
 }

package/dist/components/blocks/ai/ai-shimmer/types.d.ts

@@ -1,4 +1,5 @@
 import type { ReactNode } from 'react';
+import type { TextProps } from '../../../typography';
 export interface AiShimmerProps {
     /** Children rendered with the shimmer gradient. Defaults to a placeholder string. */
     children?: ReactNode;
@@ -6,6 +7,8 @@ export interface AiShimmerProps {
     paused?: boolean;
     /** Animation duration in seconds. */
     duration?: number;
+    /** Text size of the shimmering copy. Defaults to the provider text size. */
+    size?: TextProps['size'];
     /** Merged onto the outermost node. */
     className?: string;
 }

package/dist/components/blocks/commerce/address-card/address-card.d.ts

@@ -1,5 +1,5 @@
 import { type AddressCardProps } from './types';
-export declare function AddressCard({ kind, name, line1, line2, city, region, postalCode, country, phone, default: defaultAddress, onEdit, onRemove, onMakeDefault, surface, padding, headerDivider, className, strings: stringsProp, }: AddressCardProps): import("react").JSX.Element;
+export declare function AddressCard({ kind, name, line1, line2, city, region, postalCode, country, phone, default: defaultAddress, onEdit, onRemove, onMakeDefault, surface, padding, headerDivider, className, strings: stringsProp, ...props }: AddressCardProps): import("react").JSX.Element;
 export declare namespace AddressCard {
     var displayName: string;
 }

package/dist/components/blocks/commerce/address-card/types.d.ts

@@ -1,3 +1,4 @@
+import type { ComponentPropsWithoutRef } from 'react';
 import type { CardProps } from '../../../base/cards';
 import type { StringsProp } from '../../../../lib/strings';
 export type AddressKind = 'shipping' | 'billing' | 'pickup';
@@ -12,7 +13,7 @@ export interface AddressCardStrings {
 }
 export declare const defaultAddressCardStrings: AddressCardStrings;
 /** Unframed by default. Set surface="card" to let this owner frame its heading and body. */
-export interface AddressCardProps extends Pick<CardProps, 'surface' | 'padding' | 'headerDivider'> {
+export interface AddressCardProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>, Pick<CardProps, 'surface' | 'padding' | 'headerDivider'> {
     /** What the address is for — billing, shipping, or both. */
     kind?: AddressKind;
     /** Display name. */

package/dist/components/blocks/commerce/cart-summary/cart-summary.d.ts

@@ -1,5 +1,7 @@
 import { type CartSummaryCardProps } from './types';
-export declare function CartSummaryCard({ items, subtotal, tax, shipping, discount, total, onCheckout, className, strings: stringsProp, }: CartSummaryCardProps): import("react").JSX.Element;
+export declare function CartSummaryCard({ items, subtotal, tax, shipping, discount, total, onCheckout, className, strings: stringsProp, ...props }: CartSummaryCardProps): import("react").JSX.Element;
 export declare namespace CartSummaryCard {
     var displayName: string;
 }
+/** The source kit's name for `CartSummaryCard`; the same component. */
+export declare const CartSummary: typeof CartSummaryCard;

package/dist/components/blocks/commerce/cart-summary/index.d.ts

@@ -1,2 +1,2 @@
-export { CartSummaryCard } from './cart-summary';
-export { defaultCartSummaryStrings, type CartSummaryCardProps, type CartSummaryStrings, type CartLineItem, } from './types';
+export { CartSummary, CartSummaryCard } from './cart-summary';
+export { defaultCartSummaryStrings, type CartSummaryCardProps, type CartSummaryProps, type CartSummaryStrings, type CartLineItem, } from './types';

package/dist/components/blocks/commerce/cart-summary/types.d.ts

@@ -1,3 +1,4 @@
+import type { ComponentPropsWithoutRef } from 'react';
 import type { StringsProp } from '../../../../lib/strings';
 export interface CartLineItem {
     /** Stable identity for this entry. */
@@ -30,9 +31,11 @@ export interface CartSummaryStrings {
     /** Formatted order total. */
     total: string;
     checkout: string;
+    /** Writes a line's quantity, so a translation owns the multiplication sign. */
+    formatQuantity: (quantity: number) => string;
 }
 export declare const defaultCartSummaryStrings: CartSummaryStrings;
-export interface CartSummaryCardProps {
+export interface CartSummaryCardProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'> {
     /** Line items in the cart. */
     items: CartLineItem[];
     /** Formatted total before tax, shipping, and discounts. */
@@ -51,3 +54,5 @@ export interface CartSummaryCardProps {
     /** Overrides this surface's own copy. */
     strings?: StringsProp<CartSummaryStrings>;
 }
+/** The source kit's name for `CartSummaryCardProps`. */
+export type CartSummaryProps = CartSummaryCardProps;

package/dist/components/blocks/commerce/discount-stack/discount-stack.d.ts

@@ -1,5 +1,7 @@
 import { type DiscountStackPreviewProps } from './types';
-export declare function DiscountStackPreview({ discounts, totalSavings, className, strings: stringsProp, }: DiscountStackPreviewProps): import("react").JSX.Element;
+export declare function DiscountStackPreview({ discounts, totalSavings, className, strings: stringsProp, ...props }: DiscountStackPreviewProps): import("react").JSX.Element;
 export declare namespace DiscountStackPreview {
     var displayName: string;
 }
+/** The source kit's name for `DiscountStackPreview`; the same component. */
+export declare const DiscountStack: typeof DiscountStackPreview;

package/dist/components/blocks/commerce/discount-stack/index.d.ts

@@ -1,2 +1,2 @@
-export { DiscountStackPreview } from './discount-stack';
-export { defaultDiscountStackStrings, type Discount, type DiscountStackPreviewProps, type DiscountStackStrings, } from './types';
+export { DiscountStack, DiscountStackPreview } from './discount-stack';
+export { defaultDiscountStackStrings, type Discount, type DiscountStackPreviewProps, type DiscountStackProps, type DiscountStackStrings, } from './types';

package/dist/components/blocks/commerce/discount-stack/types.d.ts

@@ -1,12 +1,22 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
 import type { BadgeTone } from '../../../base/badge';
 import type { StringsProp } from '../../../../lib/strings';
 export interface Discount {
-    type: string;
+    /** Stable identity for this entry. Falls back to the kind, label and position. */
+    id?: string;
     /** Display label. */
     label: string;
+    /** Already formatted. Rendered as a deduction whatever sign it carries. */
     amount: string;
-    /** Tone of the type chip. Discount types are kinds, so pass `neutral` unless the chip states a status. */
-    badge: BadgeTone;
+    /** What kind of discount it is ("Code", "Automatic"), shown quietly beside the amount. */
+    kind?: ReactNode;
+    /** The kind as plain text. Kept for existing callers; `kind` wins when both are set. */
+    type?: string;
+    /**
+     * Draws the kind as a chip in this tone. Discount kinds are categories, so
+     * pass `neutral` unless the chip states a status. Omit it for the quiet note.
+     */
+    badge?: BadgeTone;
 }
 export interface DiscountStackStrings {
     /** Surface title. */
@@ -15,7 +25,7 @@ export interface DiscountStackStrings {
     totalSavings: string;
 }
 export declare const defaultDiscountStackStrings: DiscountStackStrings;
-export interface DiscountStackPreviewProps {
+export interface DiscountStackPreviewProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'> {
     /** Discounts applied, in the order they stack. */
     discounts: Discount[];
     /** Formatted sum of every discount. */
@@ -25,3 +35,5 @@ export interface DiscountStackPreviewProps {
     /** Overrides this surface's own copy. */
     strings?: StringsProp<DiscountStackStrings>;
 }
+/** The source kit's name for `DiscountStackPreviewProps`. */
+export type DiscountStackProps = DiscountStackPreviewProps;

package/dist/components/blocks/commerce/fulfillment-group/fulfillment-group.d.ts

@@ -0,0 +1,5 @@
+import { type FulfillmentGroupProps } from './types';
+export declare function FulfillmentGroup({ status, location, notice, noticeIcon: NoticeIcon, items, children, actions, renderLink, className, strings: stringsProp, ...props }: FulfillmentGroupProps): import("react").JSX.Element;
+export declare namespace FulfillmentGroup {
+    var displayName: string;
+}

package/dist/components/blocks/commerce/fulfillment-group/index.d.ts

@@ -0,0 +1,2 @@
+export { FulfillmentGroup } from './fulfillment-group';
+export { defaultFulfillmentGroupStrings, type FulfillmentGroupProps, type FulfillmentGroupStrings, } from './types';

package/dist/components/blocks/commerce/fulfillment-group/types.d.ts

@@ -0,0 +1,45 @@
+import type { ComponentPropsWithoutRef, ComponentType, ReactNode } from 'react';
+import type { ActionMenuAction, ActionMenuProps } from '../../../base/action-menu';
+import type { CardProps } from '../../../base/cards';
+import type { StringsProp } from '../../../../lib/strings';
+import type { OrderLine, OrderLineItemStrings } from '../order-line-item/types';
+import { type FulfillmentStatus } from '../shared/order-status';
+export interface FulfillmentGroupStrings extends OrderLineItemStrings {
+    /** Label for each `FulfillmentStatus`. The tone stays derived from the status. */
+    fulfillment: Record<FulfillmentStatus, string>;
+    /** Names the group by state and size: "Unfulfilled (3)". */
+    formatHeading: (status: string, count: number) => string;
+    /** Accessible name of the overflow menu holding every action after the first. */
+    moreActions: string;
+}
+export declare const defaultFulfillmentGroupStrings: FulfillmentGroupStrings;
+/** Header and footer rules follow Card's provider defaults; `headerDivider` / `footerDivider` override them per group. */
+export interface FulfillmentGroupProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>, Pick<CardProps, 'headerDivider' | 'footerDivider'> {
+    /** Where these goods are. Drives the heading chip's label and tone. */
+    status: FulfillmentStatus;
+    /** Where the group ships from. */
+    location?: ReactNode;
+    /** A standing fact about the group: "Shipping not required". */
+    notice?: ReactNode;
+    /**
+     * Glyph beside the notice, sized by the group. A component rather than a
+     * node, so it arrives at the icon size of the text it annotates.
+     */
+    noticeIcon?: ComponentType<{
+        className?: string;
+    }>;
+    /** The rows, as data. The heading counts them. */
+    items?: OrderLine[];
+    /** Replaces `items` wholesale, for a caller who needs control of a row. The heading then carries no count. */
+    children?: ReactNode;
+    /**
+     * The group's commands. The first renders as a button and the rest collapse
+     * into an overflow menu: one array, so the menu never repeats the button.
+     * Mark the main command `tone: 'primary'`.
+     */
+    actions?: readonly ActionMenuAction[];
+    /** Renders `href` actions through the consumer's router. */
+    renderLink?: ActionMenuProps['renderLink'];
+    /** Overrides this surface's own copy, including the status words. */
+    strings?: StringsProp<FulfillmentGroupStrings>;
+}

package/dist/components/blocks/commerce/index.d.ts

@@ -4,8 +4,8 @@ export { Receipt, ReceiptItems, type ReceiptProps, type ReceiptItemsProps, type
 export { BookingCalendarEventCard, type BookingCalendarEventCardItem, type BookingCalendarEventCardProps, } from './booking-calendar-event-card';
 export type { LoyaltyHistoryEntry, LoyaltyPointsProps, LoyaltyPointsStrings } from './loyalty-points';
 export { LoyaltyPoints, defaultLoyaltyPointsStrings } from './loyalty-points';
-export type { Discount, DiscountStackPreviewProps, DiscountStackStrings } from './discount-stack';
-export { DiscountStackPreview, defaultDiscountStackStrings } from './discount-stack';
+export type { Discount, DiscountStackPreviewProps, DiscountStackProps, DiscountStackStrings } from './discount-stack';
+export { DiscountStack, DiscountStackPreview, defaultDiscountStackStrings } from './discount-stack';
 export type { ShipmentDetail, ShipmentStatus, ShipmentTrackingProps, ShipmentTrackingStrings, TrackingStep, } from './shipment-tracking';
 export { ShipmentTracking, defaultShipmentTrackingStrings } from './shipment-tracking';
 export { GiftcardCard, type GiftcardCardProps, type GiftcardCardVariant, type GiftcardData, type GradientVariant, type PatternVariant, type AccentColor, type HeaderColor, } from './giftcard-card';
@@ -13,13 +13,13 @@ export { defaultVendorProfileStrings, VendorProfileCard, type VendorProfileCardP
 export { InventoryLevel, defaultInventoryLevelStrings, type InventoryLevelProps, type InventoryLevelStrings, } from './inventory-level';
 export { TaxBreakdownCard, defaultTaxBreakdownStrings, type TaxBreakdownCardProps, type TaxBreakdownStrings, type TaxLineItem, } from './tax-breakdown';
 export { SubscriptionSummaryCard, defaultSubscriptionSummaryStrings, type SubscriptionSummaryCardProps, type SubscriptionSummaryStrings, type SubscriptionPerk, } from './subscription-summary';
-export { RefundStatusCard, defaultRefundStatusStrings, type RefundStatusCardProps, type RefundStatusStrings, type RefundStage, } from './refund-status';
+export { RefundStatus, RefundStatusCard, defaultRefundStatusStrings, type RefundStatusProps, type RefundStatusCardProps, type RefundStatusStrings, type RefundStage, } from './refund-status';
 export { AddressCard, defaultAddressCardStrings, type AddressCardProps, type AddressCardStrings, type AddressKind, } from './address-card';
 export { VoucherEntry, defaultVoucherEntryStrings, type VoucherEntryProps, type VoucherEntryStrings, } from './voucher-entry';
-export { CartSummaryCard, defaultCartSummaryStrings, type CartSummaryCardProps, type CartSummaryStrings, type CartLineItem, } from './cart-summary';
+export { CartSummary, CartSummaryCard, defaultCartSummaryStrings, type CartSummaryProps, type CartSummaryCardProps, type CartSummaryStrings, type CartLineItem, } from './cart-summary';
 export { CouponInputCard, defaultCouponInputStrings, type CouponInputCardProps, type CouponInputStrings, } from './coupon-input';
 export { OrderStatusCard, defaultOrderStatusStrings, type OrderStatusCardProps, type OrderStatusStrings, type OrderStatusEvent, type OrderStatusKind, } from './order-status';
-export { PaymentMethod, defaultPaymentMethodStrings, type PaymentMethodProps, type PaymentMethodStrings, type PaymentBrand, } from './payment-method';
+export { PaymentMethod, PaymentMethodCard, defaultPaymentMethodStrings, type PaymentMethodCardProps, type PaymentMethodProps, type PaymentMethodStrings, type PaymentMethodVariant, type PaymentBrand, } from './payment-method';
 export { SeoListingCard, DEFAULT_SEO_LISTING_LIMITS, calculateSeoListingScore, defaultSeoListingCardStrings, getSeoPermalinkPath, getSeoPermalinkSlug, type SeoListingCardProps, type SeoListingCardStrings, type SeoListingCheckId, type SeoListingCheckResult, type SeoListingCheckStatus, type SeoListingScoreInput, type SeoListingScoreLimits, type SeoListingScoreResult, } from './seo-listing';
 export type { InvoiceStatus, InvoiceMiniData, InvoiceMiniProps } from './invoice-mini';
 export { InvoiceMini } from './invoice-mini';
@@ -32,3 +32,11 @@ export { OrderTimeline } from './order-timeline';
 export type { PaymentEvent, PaymentTimelineProps } from './payment-timeline';
 export { PaymentTimeline } from './payment-timeline';
 export { InventorySectionCard, defaultInventorySectionStrings, type InventoryPolicy, type InventorySectionCardProps, type InventorySectionChange, type InventorySectionField, type InventorySectionMetric, type InventorySectionName, type InventorySectionStrings, type InventorySectionValue, type InventoryStatus, } from './inventory-section';
+export { AmountRow, SummaryPanel, type AmountRowProps, type SummaryPanelProps } from './summary-panel';
+export type { FulfillmentStatus, OrderAddress, PaymentStatus, TransactionKind, TransactionStatus, } from './shared/order-status';
+export { OrderHeader, defaultOrderHeaderStrings, type OrderHeaderProps, type OrderHeaderStrings, } from './order-header';
+export { FulfillmentGroup, defaultFulfillmentGroupStrings, type FulfillmentGroupProps, type FulfillmentGroupStrings, } from './fulfillment-group';
+export { OrderLineItem, defaultOrderLineItemStrings, type OrderLine, type OrderLineItemProps, type OrderLineItemStrings, type OrderLineProperty, } from './order-line-item';
+export { OrderSummary, defaultOrderSummaryStrings, type OrderSummaryProps, type OrderSummaryStrings, type SummaryLine, } from './order-summary';
+export { OrderTransactions, defaultOrderTransactionsStrings, type OrderTransactionsProps, type OrderTransactionsStrings, type Transaction, } from './order-transactions';
+export { OrderCustomer, defaultOrderCustomerStrings, type OrderCustomerProps, type OrderCustomerStrings, } from './order-customer';

package/dist/components/blocks/commerce/invoice-header/invoice-header.d.ts

@@ -1,5 +1,5 @@
 import { type InvoiceHeaderProps } from './types';
-export declare function InvoiceHeader({ invoiceNumber, status, statusTone, from, to, issuedDate, dueDate, amount, className, strings: stringsProp, }: InvoiceHeaderProps): import("react").JSX.Element;
+export declare function InvoiceHeader({ invoiceNumber, status, statusTone, from, to, issuedDate, dueDate, amount, className, strings: stringsProp, ...props }: InvoiceHeaderProps): import("react").JSX.Element;
 export declare namespace InvoiceHeader {
     var displayName: string;
 }

package/dist/components/blocks/commerce/invoice-header/types.d.ts

@@ -1,10 +1,12 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
 import type { BadgeTone } from '../../../base/badge';
 import type { StringsProp } from '../../../../lib/strings';
 import type { InvoiceStatus } from '../invoice-mini/types';
 export interface InvoiceParty {
     /** Display name. */
     name: string;
-    location?: string;
+    /** Where the party is: a city line, or a node such as a full address. */
+    location?: ReactNode;
 }
 export interface InvoiceHeaderStrings {
     /** Surface title. */
@@ -20,7 +22,7 @@ export interface InvoiceHeaderStrings {
     overdue: string;
 }
 export declare const defaultInvoiceHeaderStrings: InvoiceHeaderStrings;
-export interface InvoiceHeaderProps {
+export interface InvoiceHeaderProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'> {
     /** Human-facing invoice reference. */
     invoiceNumber: string;
     /**

package/dist/components/blocks/commerce/invoice-mini/invoice-mini.d.ts

@@ -1,5 +1,5 @@
 import { type InvoiceMiniProps } from './types';
-export declare function InvoiceMini({ invoice, className, strings: stringsProp, }: InvoiceMiniProps): import("react").JSX.Element;
+export declare function InvoiceMini({ invoice, className, strings: stringsProp, ...props }: InvoiceMiniProps): import("react").JSX.Element;
 export declare namespace InvoiceMini {
     var displayName: string;
 }

package/dist/components/blocks/commerce/invoice-mini/types.d.ts

@@ -1,3 +1,4 @@
+import type { ComponentPropsWithoutRef } from 'react';
 import type { BadgeTone } from '../../../base/badge';
 import type { StringsProp } from '../../../../lib/strings';
 export type InvoiceStatus = 'paid' | 'pending' | 'overdue';
@@ -17,7 +18,7 @@ export interface InvoiceMiniStrings {
     due: string;
 }
 export declare const defaultInvoiceMiniStrings: InvoiceMiniStrings;
-export interface InvoiceMiniProps {
+export interface InvoiceMiniProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
     /** The invoice to summarise. */
     invoice: InvoiceMiniData;
     /** Merged onto the outermost node. */

package/dist/components/blocks/commerce/order-customer/index.d.ts

@@ -0,0 +1,2 @@
+export { OrderCustomer } from './order-customer';
+export { defaultOrderCustomerStrings, type OrderCustomerProps, type OrderCustomerStrings, } from './types';

package/dist/components/blocks/commerce/order-customer/order-customer.d.ts

@@ -0,0 +1,5 @@
+import { type OrderCustomerProps } from './types';
+export declare function OrderCustomer({ name, email, phone, orderCount, shippingAddress, billingAddress, billingSameAsShipping, onOpenCustomer, onEditShipping, onEditBilling, surface, padding, headerDivider, className, strings: stringsProp, ...props }: OrderCustomerProps): import("react").JSX.Element;
+export declare namespace OrderCustomer {
+    var displayName: string;
+}

package/dist/components/blocks/commerce/order-customer/types.d.ts

@@ -0,0 +1,48 @@
+import type { ComponentPropsWithoutRef } from 'react';
+import type { CardProps } from '../../../base/cards';
+import type { StringsProp } from '../../../../lib/strings';
+import type { OrderAddress } from '../shared/order-status';
+export interface OrderCustomerStrings {
+    /** Surface title. */
+    title: string;
+    shippingAddress: string;
+    billingAddress: string;
+    /**
+     * One name per edit button: each is the accessible name of a glyph with no
+     * text beside it, and a single "Edit" would announce two controls alike.
+     */
+    editShipping: string;
+    editBilling: string;
+    /** Shown in place of a repeated billing address. */
+    sameAsShipping: string;
+    /** Shown when an address is missing. */
+    noAddress: string;
+    /** How many orders the customer has placed, this one included. */
+    formatOrderCount: (count: number) => string;
+}
+export declare const defaultOrderCustomerStrings: OrderCustomerStrings;
+/** Unframed by default. Set surface="card" to let this owner frame its heading and body. */
+export interface OrderCustomerProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'title'>, Pick<CardProps, 'surface' | 'padding' | 'headerDivider'> {
+    /** The customer's display name. */
+    name: string;
+    /** Contact email, rendered as a mail link. */
+    email?: string;
+    /** Contact number, rendered as a call link. */
+    phone?: string;
+    /** How many orders this customer has placed, this one included. */
+    orderCount?: number;
+    /** Where the order ships. */
+    shippingAddress?: OrderAddress;
+    /** Where the order is billed. */
+    billingAddress?: OrderAddress;
+    /** Renders one line in place of a repeated billing address. */
+    billingSameAsShipping?: boolean;
+    /** Turns the identity row into a button. The app decides whether it navigates or opens a panel. */
+    onOpenCustomer?: () => void;
+    /** Shows an edit button on the shipping address. */
+    onEditShipping?: () => void;
+    /** Shows an edit button on the billing address. */
+    onEditBilling?: () => void;
+    /** Overrides this surface's own copy. */
+    strings?: StringsProp<OrderCustomerStrings>;
+}

package/dist/components/blocks/commerce/order-header/index.d.ts

@@ -0,0 +1,2 @@
+export { OrderHeader } from './order-header';
+export { defaultOrderHeaderStrings, type OrderHeaderProps, type OrderHeaderStrings, } from './types';

package/dist/components/blocks/commerce/order-header/order-header.d.ts

@@ -0,0 +1,5 @@
+import { type OrderHeaderProps } from './types';
+export declare function OrderHeader({ orderNumber, fulfillmentStatus, paymentStatus, placedAt, source, actions, renderLink, headingTag, className, strings: stringsProp, ...props }: OrderHeaderProps): import("react").JSX.Element;
+export declare namespace OrderHeader {
+    var displayName: string;
+}