Virtual Card
Type | Description |
---|---|
read-only-pan | The card’s PAN. |
read-only-expiration | The card’s expiration date. |
read-only-cvv | The card’s CVV2. |
PIN
Type | Description |
---|---|
pin | Allows cardholders to set their PIN code. |
new-pin | Allows cardholders to set their new PIN code (change PIN method). |
old-pin | Allows cardholders to enter their current PIN code (change PIN method). |
Field options
All Smart Fields accept a common set of options, and then some field specific options.
Option | Type | Description |
---|---|---|
classes | Object | Set custom class names on the container DOM element when the dLocal Field is in a particular state. - base - The base class applied to the container. Defaults to dLocalField. |
style | Object (Optional) | Customize appearance using CSS properties. Style is specified as an object for any of the variants below. - base , base style—all other variants inherit from this styleFor each of the above, the properties below can be customized. - color - fontFamily - fontSize - fontSmoothing - fontStyle - fontVariant - iconColor - lineHeight , to avoid cursors being rendered inconsistently across browsers, consider using a padding on the Field's container instead.- letterSpacing - textDecoration - textShadow - textTransform The following pseudo-classes and pseudo-elements can also be styled with the above properties, as a nested object inside the variant. - :hover |
panStyle | Object (Optional) | Customize the PAN style: - separatedEach : to set card number intervals.- spaceBetween : quantity of spaces (in pixels) between intervals. Eg. if you need to expose the card PAN like '1111 2222 3333 4444' - separatedEach: 4 -* spaceBetween : 1 |
maskInput | Boolean (Optional) | Mask the value like an input type password. |
hideIcon | Bolean (Optional) | Hide the card scheme icon. |