@geomak/ui 6.15.0 → 6.17.0

package/dist/index.d.cts

@@ -626,21 +626,23 @@ interface IconButtonProps {
  * <IconButton icon={<Icon.Search />} onClick={doSearch} />
  * <IconButton type="bordered" icon={<Icon.Edit />} />
  */
-declare function IconButton({ icon, onClick, type, buttonType, disabled, size, loading, loadingIcon, className, style, }: IconButtonProps): react_jsx_runtime.JSX.Element;
+declare function IconButton({ icon, onClick, type, buttonType, disabled, size, loading, loadingIcon, title, className, style, }: IconButtonProps): react_jsx_runtime.JSX.Element;
 
+type ModalSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
 interface ModalProps {
     /**
-     * Max width of the modal panel in pixels (default 600).
-     * On narrow viewports the panel fills the screen minus 1 rem on each side.
-     * Height is always content-driven (max 90 dvh).
+     * Named width scale (default `'md'`). Keeps modals consistent across the
+     * app: sm 400 · md 600 · lg 800 · xl 1000 · full (viewport − 2rem).
      */
-    width?: number;
+    size?: ModalSize;
     /**
-     * @deprecated Use `width` instead. The second tuple value (height) was
-     * never honoured and is silently ignored. Kept for backwards
-     * compatibility — will be removed in a future major version.
+     * Explicit max-width escape hatch — a number (px) or any CSS length
+     * (e.g. `'48rem'`). Overrides `size` when set.
+     *
+     * Height is always content-driven (max 90 dvh): modals grow with their
+     * content and scroll internally rather than taking a fixed height.
      */
-    size?: [number, number] | [number];
+    width?: number | string;
     isOpen?: boolean;
     onClose?: () => void;
     onOk?: () => void;
@@ -667,13 +669,23 @@ interface ModalProps {
  */
 declare function Modal({ width, size, isOpen, onClose, onOk, onCancel, okText, cancelText, hasFooter, title, children, className, }: ModalProps): react_jsx_runtime.JSX.Element;
 
+type DrawerSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
 interface DrawerProps {
     isOpen?: boolean;
     onClose?: () => void;
     hasFooter?: boolean;
     /** 'left' | 'right' — which edge the panel slides from */
     placement?: 'left' | 'right';
-    width?: number;
+    /**
+     * Named width scale (default `'md'`): sm 280 · md 320 · lg 480 · xl 640 ·
+     * full (viewport − 1rem). The panel always spans the full viewport height.
+     */
+    size?: DrawerSize;
+    /**
+     * Explicit width escape hatch — a number (px) or any CSS length
+     * (e.g. `'30rem'`). Overrides `size` when set.
+     */
+    width?: number | string;
     okText?: string;
     cancelText?: string;
     onOk?: () => void;
@@ -695,7 +707,7 @@ interface DrawerProps {
  *   <FilterForm />
  * </Drawer>
  */
-declare function Drawer({ isOpen, onClose, hasFooter, placement, width, okText, cancelText, onOk, onCancel, title, children, className, }: DrawerProps): react_jsx_runtime.JSX.Element;
+declare function Drawer({ isOpen, onClose, hasFooter, placement, size, width, okText, cancelText, onOk, onCancel, title, children, className, }: DrawerProps): react_jsx_runtime.JSX.Element;
 
 interface TooltipProps {
     children: React__default.ReactNode;
@@ -1394,6 +1406,335 @@ interface CartProps {
  */
 declare function Cart({ items, onQuantityChange, onRemove, summaryRows, formatPrice, checkoutLabel, onCheckout, emptyState, className, style, }: CartProps): react_jsx_runtime.JSX.Element;
 
+/** Shape accepted by `addToCart` — quantity is optional (defaults to 1). */
+type CartItemInput = Omit<CartLineItem, 'quantity'> & {
+    quantity?: number;
+};
+interface CartContextValue {
+    /** Current line items. */
+    items: CartLineItem[];
+    /**
+     * Add an item to the cart. If an item with the same `id` is already
+     * present, its quantity is increased (clamped to the line's `max`).
+     */
+    addToCart: (item: CartItemInput, quantity?: number) => void;
+    /** Remove a line entirely by id. */
+    removeFromCart: (id: CartLineItem['id']) => void;
+    /** Set an exact quantity for a line (clamped to `1..max`). */
+    updateQuantity: (id: CartLineItem['id'], quantity: number) => void;
+    /** Empty the cart. */
+    clearCart: () => void;
+    /** Whether a line with this id exists. */
+    isInCart: (id: CartLineItem['id']) => boolean;
+    /** Total number of units across all lines (sum of quantities). */
+    getItemCount: () => number;
+    /** Subtotal — sum of `price × quantity` across all lines. */
+    getCartTotal: () => number;
+}
+interface CartProviderProps {
+    children: React__default.ReactNode;
+    /** Seed the cart with these lines. */
+    initialItems?: CartLineItem[];
+    /** Called whenever the items change (add / remove / quantity / clear). */
+    onChange?: (items: CartLineItem[]) => void;
+}
+/**
+ * Provides a robust, app-wide cart API. Wrap any subtree and call
+ * {@link useCart} from anywhere inside to add, remove, and total items —
+ * the cart panel, a product grid, and a topbar badge all stay in sync off the
+ * same store.
+ *
+ * The store is uncontrolled (owns its own state, seeded by `initialItems`);
+ * subscribe to mutations via `onChange` to persist or sync externally.
+ *
+ * @example
+ * <CartProvider>
+ *   <App />
+ * </CartProvider>
+ *
+ * // anywhere inside:
+ * const { addToCart, getItemCount } = useCart()
+ * addToCart({ id: 1, name: 'Radar unit', price: 1290 })
+ */
+declare function CartProvider({ children, initialItems, onChange }: CartProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Read the enclosing {@link CartProvider}'s store. Throws if used outside a
+ * `<CartProvider>`.
+ *
+ * @example
+ * const { items, addToCart, removeFromCart, getCartTotal } = useCart()
+ */
+declare function useCart(): CartContextValue;
+
+interface CartButtonProps {
+    /** Click handler — typically opens the cart drawer / navigates to checkout. */
+    onClick?: React__default.MouseEventHandler<HTMLButtonElement>;
+    /** Icon-button style. Default `'bordered'`. */
+    variant?: 'primary' | 'bordered';
+    /** Badge colour. Default `'accent'`. */
+    badgeTone?: BadgeTone;
+    /** Cap the badge number (e.g. `9+`). Default `99`. */
+    max?: number;
+    /** Accessible label. Default `'Cart'` (with the live count appended). */
+    title?: string;
+    /** Override the cart glyph. */
+    icon?: React__default.ReactNode;
+    className?: string;
+}
+/**
+ * A cart trigger for the app TopBar: an {@link IconButton} with a live count
+ * {@link Badge} overlaid on its top-right corner. Reads the count straight from
+ * the {@link useCart} store, so it must be rendered inside a `<CartProvider>`.
+ *
+ * @example
+ * <TopBar actions={<CartButton onClick={() => setCartOpen(true)} />} />
+ */
+declare function CartButton({ onClick, variant, badgeTone, max, title, icon, className, }: CartButtonProps): react_jsx_runtime.JSX.Element;
+
+interface EmptyCartProps {
+    /**
+     * Illustration shown above the text. Pass your own node to fully replace
+     * the default line-art cart. Set to `null` to hide it.
+     */
+    illustration?: React__default.ReactNode;
+    /** Headline. Default `'Your cart is empty'`. */
+    title?: React__default.ReactNode;
+    /** Secondary line under the title. */
+    description?: React__default.ReactNode;
+    /** Optional call-to-action (e.g. a "Browse products" button). */
+    action?: React__default.ReactNode;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+/**
+ * The empty state for a shopping cart — a configurable illustration with a
+ * title, optional description, and an optional call-to-action.
+ *
+ * Pass a custom `illustration` to match your brand, or override `title` /
+ * `description` / `action` for the messaging.
+ *
+ * @example
+ * <EmptyCart
+ *   title="Nothing here yet"
+ *   description="Browse the catalog to add items."
+ *   action={<Button content="Browse products" onClick={goShop} />}
+ * />
+ *
+ * @example
+ * // Drop it straight into the Cart panel's empty slot
+ * <Cart items={[]} emptyState={<EmptyCart illustration={<MyArt />} />} />
+ */
+declare function EmptyCart({ illustration, title, description, action, className, style, }: EmptyCartProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Shared field foundation for all oxygen-ui inputs.
+ *
+ * Centralises the things every input must agree on:
+ * - the **size scale** (sm / md / lg) → control height + text size + padding
+ * - the **refined focus treatment** — a crisp 1px accent border plus a soft
+ *   3px low-opacity halo (NOT a heavy solid ring band)
+ * - the **resting / hover / error / disabled** border + background states
+ * - a **`<Field>` wrapper** handling label, error region, layout
+ *   (horizontal / vertical) and `aria` linkage consistently
+ *
+ * All values map to design-system tokens (control heights, semantic colours,
+ * radii) so a consumer's ThemeProvider override flows straight through.
+ */
+type FieldSize = 'sm' | 'md' | 'lg';
+interface FieldShellOptions {
+    size?: FieldSize;
+    hasError?: boolean;
+    disabled?: boolean;
+    /**
+     * `true` for wrapper elements that hold a real `<input>` inside
+     * (focus-within), `false` for elements that are themselves focusable
+     * like `<button>` triggers (focus-visible). Default `false`.
+     */
+    focusWithin?: boolean;
+    /** Append height/padding utilities (for single-line inputs). Default `true`. */
+    sized?: boolean;
+}
+/**
+ * Compose the className for an input's outer "shell" — the bordered, rounded
+ * box that carries the focus ring. Apply to the `<input>` directly, or to a
+ * wrapper `<div>` that contains an input plus adornments (pass
+ * `focusWithin: true` in that case).
+ */
+declare function fieldShell({ size, hasError, disabled, focusWithin, sized, }?: FieldShellOptions): string;
+/**
+ * Small themed "info" affordance shown beside a field label. Hovering or
+ * focusing it reveals `helperText` in a tooltip. Rendered as a `type="button"`
+ * so it never submits an enclosing form, and coloured from semantic tokens so
+ * it follows the active theme.
+ */
+declare function FieldHelpIcon({ text }: {
+    text: React__default.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+interface FieldLabelProps {
+    label?: React__default.ReactNode;
+    htmlFor?: string;
+    required?: boolean;
+    /** Reveals an info icon + tooltip beside the label. */
+    helperText?: React__default.ReactNode;
+    /** Apply horizontal-layout spacing (no-wrap, shrink). */
+    horizontal?: boolean;
+    /**
+     * Vertical alignment of the label against the control in horizontal layout.
+     * `'start'` (default) nudges the label down to meet a standard ~36px input's
+     * first line; `'center'` removes that offset so the label centres against a
+     * short control (Switch, SegmentedControl).
+     */
+    align?: 'start' | 'center';
+    style?: React__default.CSSProperties;
+    /** Label column width in horizontal layout. */
+    width?: string | number;
+    className?: string;
+}
+/**
+ * The label row shared by every input — label text + required asterisk +
+ * optional `helperText` info icon. Components that render their own label
+ * outside `<Field>` (Dropdown, DatePicker, Switch, SegmentedControl) use this
+ * so the affordance is pixel-identical everywhere.
+ *
+ * Returns `null` when there's nothing to show (no label and no helperText).
+ */
+declare function FieldLabel({ label, htmlFor, required, helperText, horizontal, align, style, width, className, }: FieldLabelProps): react_jsx_runtime.JSX.Element;
+interface FieldProps {
+    label?: React__default.ReactNode;
+    /** `id` of the control — links the `<label htmlFor>`. */
+    htmlFor?: string;
+    /** `id` for the error region — pair with `aria-describedby` on the control. */
+    errorId?: string;
+    errorMessage?: React__default.ReactNode;
+    /** Orientation of label vs control. Default `'vertical'`. */
+    layout?: 'horizontal' | 'vertical';
+    /** Show a required asterisk after the label. */
+    required?: boolean;
+    /** Contextual help revealed via an info icon + tooltip beside the label. */
+    helperText?: React__default.ReactNode;
+    /**
+     * Label alignment against the control in horizontal layout. `'start'`
+     * (default) for standard-height inputs; `'center'` for short controls
+     * (Switch) so the label lines up with the control's centre.
+     */
+    labelAlign?: 'start' | 'center';
+    labelStyle?: React__default.CSSProperties;
+    /** Width of the label column in horizontal layout (CSS length). */
+    labelWidth?: string | number;
+    className?: string;
+    /** The control itself (input / trigger / dropzone). */
+    children: React__default.ReactNode;
+}
+/**
+ * Layout wrapper shared by every input. Renders:
+ *
+ * ```
+ * vertical:                  horizontal:
+ *   [label]                    [label] [ control        ]
+ *   [ control ]                        [ error message  ]
+ *   [ error   ]
+ * ```
+ *
+ * The error message always sits under the **control only** (never spanning
+ * the label in horizontal layout). Label uses full-contrast foreground +
+ * medium weight so it reads as the anchor, while the input's placeholder is
+ * muted — establishing hierarchy without making the label tiny.
+ */
+declare function Field({ label, htmlFor, errorId, errorMessage, layout, required, helperText, labelAlign, labelStyle, labelWidth, className, children, }: FieldProps): react_jsx_runtime.JSX.Element;
+
+/** The normalised value emitted on change / submit. */
+interface CreditCardValue {
+    /** Digits only (no spaces). */
+    number: string;
+    /** Cardholder name. */
+    name: string;
+    /** `MM/YY`. */
+    expiry: string;
+    /** Digits only. */
+    cvv: string;
+    /** Detected brand id (`'visa'`, `'amex'`…) or `null`. */
+    brand: string | null;
+}
+interface CreditCardFormProps {
+    /** Called with the validated card once every field passes on submit. */
+    onSubmit?: (card: CreditCardValue) => void | Promise<void>;
+    /** Called on every keystroke with the current (possibly invalid) card. */
+    onChange?: (card: CreditCardValue) => void;
+    /** Seed the fields (uncontrolled). Number/expiry are auto-formatted. */
+    defaultValue?: Partial<CreditCardValue>;
+    /** Size preset for the inner fields. Default `'md'`. */
+    size?: FieldSize;
+    /** Disable every field + the submit button. */
+    disabled?: boolean;
+    /**
+     * Disable only the submit button, leaving the fields editable. Useful to
+     * gate payment on an external condition (e.g. an empty cart) while still
+     * letting the user fill in their card. Combined with `disabled` (either
+     * disables the button).
+     */
+    submitDisabled?: boolean;
+    /** Require the cardholder name. Default `true`. */
+    requireName?: boolean;
+    /** Hide the built-in submit button (when embedding in a larger form). */
+    hideSubmit?: boolean;
+    /** Submit button label. Default `'Pay'`. */
+    submitLabel?: React__default.ReactNode;
+    /** Extra classes on the root `<form>`. */
+    className?: string;
+    /** Inline style on the root `<form>`. */
+    style?: React__default.CSSProperties;
+}
+/**
+ * Unified credit-card form built on the oxygen-ui {@link useForm} Form API.
+ *
+ * One component owns all four fields and their cross-field rules — card number
+ * (brand detection + grouping + Luhn), expiry (`MM/YY`, real month, not past),
+ * CVV (brand-aware length), and cardholder name. It is deliberately NOT shipped
+ * as separate inputs: a CVV or expiry field has no meaning outside a card form.
+ *
+ * Self-contained: render it and handle `onSubmit(card)`; the card is only
+ * delivered once everything validates. Use `onChange` for live updates (e.g. a
+ * card preview) and `hideSubmit` to embed it inside a larger form.
+ *
+ * @example
+ * <CreditCardForm onSubmit={(card) => pay(card)} submitLabel="Pay $49" />
+ */
+declare function CreditCardForm({ onSubmit, onChange, defaultValue, size, disabled, submitDisabled, requireName, hideSubmit, submitLabel, className, style, }: CreditCardFormProps): react_jsx_runtime.JSX.Element;
+
+interface CheckoutProps {
+    /** Page heading. Default `'Checkout'`. */
+    title?: React__default.ReactNode;
+    /** Extra summary rows (shipping, tax, discount) added to the cart subtotal. */
+    summaryRows?: CartSummaryRow[];
+    /** Price formatter. Default `'$' + value.toFixed(2)`. */
+    formatPrice?: (value: number) => string;
+    /** Heading above the payment form. Default `'Payment'`. */
+    paymentTitle?: React__default.ReactNode;
+    /**
+     * Pay button label. Defaults to `Pay <total>`. The button is always
+     * disabled while the cart is empty.
+     */
+    submitLabel?: React__default.ReactNode;
+    /** Fired with the validated card once the form passes and the cart is non-empty. */
+    onPaid?: (card: CreditCardValue) => void | Promise<void>;
+    className?: string;
+}
+/**
+ * A complete two-column checkout page: the {@link Cart} on the left and the
+ * {@link CreditCardForm} on the right. Reads live items from the
+ * {@link useCart} store, so it must be rendered inside a `<CartProvider>`.
+ *
+ * The pay button is disabled whenever the cart is empty (via the form's
+ * `submitDisabled`) — the card fields stay editable, but payment can't be
+ * submitted with nothing to buy. Stacks to a single column below `lg`.
+ *
+ * @example
+ * <CartProvider initialItems={items}>
+ *   <Checkout summaryRows={[{ label: 'Shipping', value: 9.5 }]} onPaid={pay} />
+ * </CartProvider>
+ */
+declare function Checkout({ title, summaryRows, formatPrice, paymentTitle, submitLabel, onPaid, className, }: CheckoutProps): react_jsx_runtime.JSX.Element;
+
 /** ─────────────────── types ─────────────────── */
 type NotificationType = 'info' | 'success' | 'warning' | 'danger';
 type NotificationPosition = 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
@@ -2557,122 +2898,6 @@ interface ButtonProps extends Omit<React__default.ButtonHTMLAttributes<HTMLButto
  */
 declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
 
-/**
- * Shared field foundation for all oxygen-ui inputs.
- *
- * Centralises the things every input must agree on:
- * - the **size scale** (sm / md / lg) → control height + text size + padding
- * - the **refined focus treatment** — a crisp 1px accent border plus a soft
- *   3px low-opacity halo (NOT a heavy solid ring band)
- * - the **resting / hover / error / disabled** border + background states
- * - a **`<Field>` wrapper** handling label, error region, layout
- *   (horizontal / vertical) and `aria` linkage consistently
- *
- * All values map to design-system tokens (control heights, semantic colours,
- * radii) so a consumer's ThemeProvider override flows straight through.
- */
-type FieldSize = 'sm' | 'md' | 'lg';
-interface FieldShellOptions {
-    size?: FieldSize;
-    hasError?: boolean;
-    disabled?: boolean;
-    /**
-     * `true` for wrapper elements that hold a real `<input>` inside
-     * (focus-within), `false` for elements that are themselves focusable
-     * like `<button>` triggers (focus-visible). Default `false`.
-     */
-    focusWithin?: boolean;
-    /** Append height/padding utilities (for single-line inputs). Default `true`. */
-    sized?: boolean;
-}
-/**
- * Compose the className for an input's outer "shell" — the bordered, rounded
- * box that carries the focus ring. Apply to the `<input>` directly, or to a
- * wrapper `<div>` that contains an input plus adornments (pass
- * `focusWithin: true` in that case).
- */
-declare function fieldShell({ size, hasError, disabled, focusWithin, sized, }?: FieldShellOptions): string;
-/**
- * Small themed "info" affordance shown beside a field label. Hovering or
- * focusing it reveals `helperText` in a tooltip. Rendered as a `type="button"`
- * so it never submits an enclosing form, and coloured from semantic tokens so
- * it follows the active theme.
- */
-declare function FieldHelpIcon({ text }: {
-    text: React__default.ReactNode;
-}): react_jsx_runtime.JSX.Element;
-interface FieldLabelProps {
-    label?: React__default.ReactNode;
-    htmlFor?: string;
-    required?: boolean;
-    /** Reveals an info icon + tooltip beside the label. */
-    helperText?: React__default.ReactNode;
-    /** Apply horizontal-layout spacing (no-wrap, shrink). */
-    horizontal?: boolean;
-    /**
-     * Vertical alignment of the label against the control in horizontal layout.
-     * `'start'` (default) nudges the label down to meet a standard ~36px input's
-     * first line; `'center'` removes that offset so the label centres against a
-     * short control (Switch, SegmentedControl).
-     */
-    align?: 'start' | 'center';
-    style?: React__default.CSSProperties;
-    /** Label column width in horizontal layout. */
-    width?: string | number;
-    className?: string;
-}
-/**
- * The label row shared by every input — label text + required asterisk +
- * optional `helperText` info icon. Components that render their own label
- * outside `<Field>` (Dropdown, DatePicker, Switch, SegmentedControl) use this
- * so the affordance is pixel-identical everywhere.
- *
- * Returns `null` when there's nothing to show (no label and no helperText).
- */
-declare function FieldLabel({ label, htmlFor, required, helperText, horizontal, align, style, width, className, }: FieldLabelProps): react_jsx_runtime.JSX.Element;
-interface FieldProps {
-    label?: React__default.ReactNode;
-    /** `id` of the control — links the `<label htmlFor>`. */
-    htmlFor?: string;
-    /** `id` for the error region — pair with `aria-describedby` on the control. */
-    errorId?: string;
-    errorMessage?: React__default.ReactNode;
-    /** Orientation of label vs control. Default `'vertical'`. */
-    layout?: 'horizontal' | 'vertical';
-    /** Show a required asterisk after the label. */
-    required?: boolean;
-    /** Contextual help revealed via an info icon + tooltip beside the label. */
-    helperText?: React__default.ReactNode;
-    /**
-     * Label alignment against the control in horizontal layout. `'start'`
-     * (default) for standard-height inputs; `'center'` for short controls
-     * (Switch) so the label lines up with the control's centre.
-     */
-    labelAlign?: 'start' | 'center';
-    labelStyle?: React__default.CSSProperties;
-    /** Width of the label column in horizontal layout (CSS length). */
-    labelWidth?: string | number;
-    className?: string;
-    /** The control itself (input / trigger / dropzone). */
-    children: React__default.ReactNode;
-}
-/**
- * Layout wrapper shared by every input. Renders:
- *
- * ```
- * vertical:                  horizontal:
- *   [label]                    [label] [ control        ]
- *   [ control ]                        [ error message  ]
- *   [ error   ]
- * ```
- *
- * The error message always sits under the **control only** (never spanning
- * the label in horizontal layout). Label uses full-contrast foreground +
- * medium weight so it reads as the anchor, while the input's placeholder is
- * muted — establishing hierarchy without making the label tiny.
- */
-declare function Field({ label, htmlFor, errorId, errorMessage, layout, required, helperText, labelAlign, labelStyle, labelWidth, className, children, }: FieldProps): react_jsx_runtime.JSX.Element;
-
 interface TextInputProps {
     /** Controlled string value. */
     value?: string;
@@ -4361,58 +4586,6 @@ declare const FormContext: React$1.Context<FormStore>;
 /** Read the enclosing `<Form>`'s store. Throws if used outside a `<Form>`. */
 declare function useFormStore(): FormStore;
 
-/** The normalised value emitted on change / submit. */
-interface CreditCardValue {
-    /** Digits only (no spaces). */
-    number: string;
-    /** Cardholder name. */
-    name: string;
-    /** `MM/YY`. */
-    expiry: string;
-    /** Digits only. */
-    cvv: string;
-    /** Detected brand id (`'visa'`, `'amex'`…) or `null`. */
-    brand: string | null;
-}
-interface CreditCardFormProps {
-    /** Called with the validated card once every field passes on submit. */
-    onSubmit?: (card: CreditCardValue) => void | Promise<void>;
-    /** Called on every keystroke with the current (possibly invalid) card. */
-    onChange?: (card: CreditCardValue) => void;
-    /** Seed the fields (uncontrolled). Number/expiry are auto-formatted. */
-    defaultValue?: Partial<CreditCardValue>;
-    /** Size preset for the inner fields. Default `'md'`. */
-    size?: FieldSize;
-    /** Disable every field + the submit button. */
-    disabled?: boolean;
-    /** Require the cardholder name. Default `true`. */
-    requireName?: boolean;
-    /** Hide the built-in submit button (when embedding in a larger form). */
-    hideSubmit?: boolean;
-    /** Submit button label. Default `'Pay'`. */
-    submitLabel?: React__default.ReactNode;
-    /** Extra classes on the root `<form>`. */
-    className?: string;
-    /** Inline style on the root `<form>`. */
-    style?: React__default.CSSProperties;
-}
-/**
- * Unified credit-card form built on the oxygen-ui {@link useForm} Form API.
- *
- * One component owns all four fields and their cross-field rules — card number
- * (brand detection + grouping + Luhn), expiry (`MM/YY`, real month, not past),
- * CVV (brand-aware length), and cardholder name. It is deliberately NOT shipped
- * as separate inputs: a CVV or expiry field has no meaning outside a card form.
- *
- * Self-contained: render it and handle `onSubmit(card)`; the card is only
- * delivered once everything validates. Use `onChange` for live updates (e.g. a
- * card preview) and `hideSubmit` to embed it inside a larger form.
- *
- * @example
- * <CreditCardForm onSubmit={(card) => pay(card)} submitLabel="Pay $49" />
- */
-declare function CreditCardForm({ onSubmit, onChange, defaultValue, size, disabled, requireName, hideSubmit, submitLabel, className, style, }: CreditCardFormProps): react_jsx_runtime.JSX.Element;
-
 /**
  * Zero-dependency credit-card helpers: brand detection, Luhn checksum, and
  * display formatting. Pure functions — no React, no deps — so they're unit
@@ -4455,4 +4628,4 @@ declare function expiryError(value: string, now?: Date): string | undefined;
 /** Validate the CVV against the detected brand's expected length. */
 declare function cvvError(value: string, cardNumber: string): string | undefined;
 
-export { Accordion, type AccordionItemProps, type AccordionProps, AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeProps, type BadgeSize, type BadgeTone, type BadgeVariant, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CARD_BRANDS, Calendar, type CalendarEvent, type CalendarProps, Card, type CardBodyProps, type CardBrand, CardCarousel, type CardCarouselProps, type CardFooterProps, type CardHeaderProps, type CardMediaProps, type CardProps, Cart, type CartLineItem, type CartProps, type CartSummaryRow, Catalog, CatalogCarousel, type CatalogCarouselProps, CatalogGrid, type CatalogGridProps, type CatalogProps, Checkbox, type CheckboxProps, ColorPicker, type ColorPickerProps, ContextMenu, type ContextMenuActionItem, type ContextMenuPosition, type ContextMenuProps, CreditCardForm, type CreditCardFormProps, type CreditCardValue, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, type DateRangePreset, type DeltaDirection, Drawer, type DrawerProps, Dropdown, type DropdownItem, type DropdownProps, type ErrorMap, type ExpandRowOptions, FAB, type FABAction, type FABPosition, type FABProps, type FABSize, type FABTone, FadingBase, type FadingBaseProps, Field, type FieldArrayItem, type FieldBindings, FieldHelpIcon, type FieldKind, FieldLabel, type FieldLabelProps, type FieldProps, type FieldRule, type FieldRules, type FieldShellOptions, type FieldSize, type FieldSnapshot, FileInput, type FileInputProps, Flex, type FlexAlign, type FlexDirection, type FlexJustify, type FlexProps, type FlexWrap, Form, FormContext, FormField, type FormFieldProps, type FormProps, FormStore, type FormStoreOptions, type FormValues, Grid, GridCard, type GridCardItem, type GridCardProps, type GridProps, Icon, IconButton, type IconButtonProps, Kbd, type KbdProps, type KbdSize, List, type ListItem, type ListProps, LoadingSpinner, type LoadingSpinnerProps, MegaMenu, type MegaMenuFeaturedProps, type MegaMenuItemProps, type MegaMenuLinkProps, type MegaMenuPanelProps, type MegaMenuProps, type MegaMenuSectionProps, Modal, type ModalProps, type NotificationPayload, NotificationProvider, NumberInput, type NumberInputProps, OpaqueGridCard, type OpaqueGridCardProps, OtpInput, type OtpInputProps, type PaginationOptions, Password, type PasswordProps, PopConfirm, type PopConfirmProps, type PopConfirmTone, Portal, type PortalProps, RadioGroup, type RadioGroupProps, type RadioOption, Rating, type RatingProps, type RulesMap, ScalableContainer, type ScalableContainerProps, SearchInput, type SearchInputProps, SegmentedControl, type SegmentedControlProps, type SegmentedOption, Sidebar, type SidebarItem, type SidebarProps, type SidebarSection, SkeletonBox, type SkeletonBoxProps, SkeletonCard, type SkeletonCardProps, SkeletonCircle, type SkeletonCircleProps, SkeletonText, type SkeletonTextProps, Slider, type SliderMark, type SliderProps, type SliderValue, type Spacing, Statistic, type StatisticDelta, type StatisticProps, type StatisticSize, Switch, type SwitchInputProps, Table, type TableColumn, type TableProps, Tabs, type TabsAddProps, type TabsListProps, type TabsOrientation, type TabsPanelProps, type TabsProps, type TabsSize, type TabsTriggerProps, type TabsVariant, TagsInput, type TagsInputProps, DatePicker as Temporal, type TemporalPickerProps, TextArea, type TextAreaProps, TextInput, type TextInputProps, type ThemeColors, type ThemeConfig, type ThemeDensity, type ThemeMotion, ThemeProvider, type ThemeProviderProps, type ThemeRadius, type ThemeShadows, ThemeSwitch, type ThemeSwitchProps, type ThemeTypography, TimePicker, type TimePickerProps, Tooltip, type TooltipProps, TooltipProvider, TopBar, type TopBarProps, Tree, type TreeItemClickPayload, type TreeNode, type TreeProps, TreeSelect, type TreeSelectProps, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, type TypographyWeight, type UseFieldArrayReturn, type UseFormFieldOptions, type UseFormReturn, type ValidateTrigger, Wizard, type WizardProps, type WizardStep, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useFieldArray, useForm, useFormField, useFormStore, useNotification };
+export { Accordion, type AccordionItemProps, type AccordionProps, AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeProps, type BadgeSize, type BadgeTone, type BadgeVariant, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CARD_BRANDS, Calendar, type CalendarEvent, type CalendarProps, Card, type CardBodyProps, type CardBrand, CardCarousel, type CardCarouselProps, type CardFooterProps, type CardHeaderProps, type CardMediaProps, type CardProps, Cart, CartButton, type CartButtonProps, type CartContextValue, type CartItemInput, type CartLineItem, type CartProps, CartProvider, type CartProviderProps, type CartSummaryRow, Catalog, CatalogCarousel, type CatalogCarouselProps, CatalogGrid, type CatalogGridProps, type CatalogProps, Checkbox, type CheckboxProps, Checkout, type CheckoutProps, ColorPicker, type ColorPickerProps, ContextMenu, type ContextMenuActionItem, type ContextMenuPosition, type ContextMenuProps, CreditCardForm, type CreditCardFormProps, type CreditCardValue, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, type DateRangePreset, type DeltaDirection, Drawer, type DrawerProps, type DrawerSize, Dropdown, type DropdownItem, type DropdownProps, EmptyCart, type EmptyCartProps, type ErrorMap, type ExpandRowOptions, FAB, type FABAction, type FABPosition, type FABProps, type FABSize, type FABTone, FadingBase, type FadingBaseProps, Field, type FieldArrayItem, type FieldBindings, FieldHelpIcon, type FieldKind, FieldLabel, type FieldLabelProps, type FieldProps, type FieldRule, type FieldRules, type FieldShellOptions, type FieldSize, type FieldSnapshot, FileInput, type FileInputProps, Flex, type FlexAlign, type FlexDirection, type FlexJustify, type FlexProps, type FlexWrap, Form, FormContext, FormField, type FormFieldProps, type FormProps, FormStore, type FormStoreOptions, type FormValues, Grid, GridCard, type GridCardItem, type GridCardProps, type GridProps, Icon, IconButton, type IconButtonProps, Kbd, type KbdProps, type KbdSize, List, type ListItem, type ListProps, LoadingSpinner, type LoadingSpinnerProps, MegaMenu, type MegaMenuFeaturedProps, type MegaMenuItemProps, type MegaMenuLinkProps, type MegaMenuPanelProps, type MegaMenuProps, type MegaMenuSectionProps, Modal, type ModalProps, type ModalSize, type NotificationPayload, NotificationProvider, NumberInput, type NumberInputProps, OpaqueGridCard, type OpaqueGridCardProps, OtpInput, type OtpInputProps, type PaginationOptions, Password, type PasswordProps, PopConfirm, type PopConfirmProps, type PopConfirmTone, Portal, type PortalProps, RadioGroup, type RadioGroupProps, type RadioOption, Rating, type RatingProps, type RulesMap, ScalableContainer, type ScalableContainerProps, SearchInput, type SearchInputProps, SegmentedControl, type SegmentedControlProps, type SegmentedOption, Sidebar, type SidebarItem, type SidebarProps, type SidebarSection, SkeletonBox, type SkeletonBoxProps, SkeletonCard, type SkeletonCardProps, SkeletonCircle, type SkeletonCircleProps, SkeletonText, type SkeletonTextProps, Slider, type SliderMark, type SliderProps, type SliderValue, type Spacing, Statistic, type StatisticDelta, type StatisticProps, type StatisticSize, Switch, type SwitchInputProps, Table, type TableColumn, type TableProps, Tabs, type TabsAddProps, type TabsListProps, type TabsOrientation, type TabsPanelProps, type TabsProps, type TabsSize, type TabsTriggerProps, type TabsVariant, TagsInput, type TagsInputProps, DatePicker as Temporal, type TemporalPickerProps, TextArea, type TextAreaProps, TextInput, type TextInputProps, type ThemeColors, type ThemeConfig, type ThemeDensity, type ThemeMotion, ThemeProvider, type ThemeProviderProps, type ThemeRadius, type ThemeShadows, ThemeSwitch, type ThemeSwitchProps, type ThemeTypography, TimePicker, type TimePickerProps, Tooltip, type TooltipProps, TooltipProvider, TopBar, type TopBarProps, Tree, type TreeItemClickPayload, type TreeNode, type TreeProps, TreeSelect, type TreeSelectProps, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, type TypographyWeight, type UseFieldArrayReturn, type UseFormFieldOptions, type UseFormReturn, type ValidateTrigger, Wizard, type WizardProps, type WizardStep, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useCart, useFieldArray, useForm, useFormField, useFormStore, useNotification };