Overview

An adaptable UI Card component for displaying credit card visuals, both front and back, supporting various card types. Ideal for seamlessly integrating into your forms.

Built upon Jesse Pollack's library.

Documentation

Description

This widget empowers you to customize the content displayed on a virtual credit card. You can define the card number, cardholder name, expiry date, and CVC number. Additionally, you have the flexibility to switch between displaying the card's front and back dynamically during runtime.

Widget Configuration

• Card Number (expression): This parameter allows you to specify the card number to be displayed. The card's image and type adapt according to the provided number.
• Card Name (expression): Use this parameter to define the cardholder's name, which will appear below the card number.
• Card Expiration Date (expression): Set this parameter to define the expiration date, displayed in the bottom right corner of the card.
• Flip Mode(boolean): Choose between "Static" and "Dynamic." Static mode allows you to set the display mode (front or back) and cannot be changed dynamically. Dynamic mode provides an expression field for real-time switching between front and back views.
• Show Back Side(boolean | expression): This parameter determines which side of the card to display. It can switch between radio buttons and an expression field, depending on the selected Flip Mode.

Typical usage scenario

Normally you will use this with some sort of form.