Customize the 3DS challenge window

You can provide styling for the 3DS challenge window when you use Payment Service with Optimizely Configured Commerce. If you do not provide customized styling, Payment Service uses the default styling.

Example

Without custom styles (current usage continues to work):

const isSpreedlyLoaded = useSpreedlyFrame();

With custom styles

const isSpreedlyLoaded = useSpreedlyFrame({
    fitToModal:  width: 600px; height: 700px; border: 2px solid #333; background: #f5f5f5; border-radius: 8px;
});