Skip to main content

SecureFieldsFieldConfig

Configuration for each individual iframe field.

Properties​

ariaLabel?​

optional ariaLabel?: string;

(Optional) ARIA label for accessibility.

brandLabels?​

optional brandLabels?: Partial<Record<Brand, string>>;

Card number field only: overrides the displayed name of one or more card brands, in the in-field badge and in the co-badge list drawn inside the frame.

Hosted form mode fills this in for you from hostedForm.brandLabels.

errorMessages?​

optional errorMessages?: Partial<Record<"none" | "format" | "length" | "empty" | "expired", string>>;

(Optional) The message to announce for each validation error the field can raise.

A screen reader reading the input cannot reach error text you render on your own page, because the input lives in a cross-origin iframe. Supplying the messages here lets the field announce the right one from inside the frame, where aria-describedby can reach it.

Hosted form mode fills this in for you from the texts in hostedForm.

Example​

errorMessages: {
  empty: 'The card number is required',
  format: 'The card number is invalid',
}

iframeTitle?​

optional iframeTitle?: string;

(Optional) Title attribute for the iframe for accessibility.

placeholder?​

optional placeholder?: string;

(Optional) Placeholder text for the input field.

target​

target: string;

The ID of the container element where the iframe will be rendered.