Card Properties
| Properties | Description |
|---|---|
product_code | (required) if product code matches one of the codes in the list the card will get that design, if no match is found Default design will be used. |
raw_data | (optional) useful if you want to create custom cards. See Card data properties. |
card_status | (optional) use one of these: active, blocked, expired. Defaults to active. |
variant | (optional) defines the appearance. Use one of these: normal or compact. Defaults to normal. |
digits | (optional) will use 8 digits if none are specified. |
card_number | (optional) masked card number. |
locale | (optional) use nb-NO or en-GB. Defaults to the Eufemia provider. |
skeleton | (optional) if set to true, an overlaying skeleton with animation will be shown. |
| Space | (optional) spacing properties like top or bottom are supported. |
Card Data
| Properties | Type | Description |
|---|---|---|
productCode | string | (required) product code for the given card. |
productName | string | (required) product name. Can be blank. |
displayName | string | (required) the visible product name. Can be empty. |
cardDesign | object | (required) object that describes the style properties of the card. can be imported from @dnb/eufemia/extensions/payment-card/utils/CardDesigns (see available designs below) or a custom one can be created. |
cardType | Union Type | (required) import CardType from @dnb/eufemia/extensions/payment-card/utils/Types to use. Can be CardType.Visa, CardType.Mastercard or CardType.None |
productType | Union Type | (required) import ProductType from @dnb/eufemia/extensions/payment-card/utils/Types to use. Can be ProductType.BankAxept, ProductType.Saga, ProductType.PrivateBanking or ProductType.None |
Card Design
| Properties | Type | Description |
|---|---|---|
name | string | (required) string Name of design |
cardStyle | string | (required) css class. mainly to set background and color |
bankLogo | Union Type | (required) Union Type. import DNB from ./card/utils/Types to use. Can be DNB.Colored('HexValue') or DNB.Metallic |
visa | Union Type | (required) Union Type. import Visa from ./card/utils/Types to use. Can be Visa.Colored('HexValue') or Visa.Metallic |
mastercard | Union Type | (required) Union Type. import Mastercard from ./card/utils/Types to use. Can be Mastercard.Default, Mastercard.DefaultWhite Mastercard.Metallic or Mastercard.MetallicBlack |
bankAxept | Union Type | (required) Union Type. import BankAxept from ./card/utils/Types to use. Can be BankAxept.White or BankAxept.Black |
saga | Union Type | (required) Union Type. import Saga from ./card/utils/Types to use. Can be Saga.Gold, Saga.Platinum, Saga.VisaPlatinum, or Saga.None |
privateBanking | Union Type | (required) Union Type. import PB from ./card/utils/Types to use. Can be PB.Default, PB.Platinum or PB.None |
List of designs
| Properties | Type | Description |
|---|---|---|
defaultDesign | object | Default |
white | object | White |
myFirst | object | My first |
youth | object | Youth |
silver | object | Silver |
gold | object | Gold |
saga | object | Saga |
sagaPlatinum | object | Saga platinum |
privateBanking | object | Private Banking |
mcBlack | object | Mastercard Black |
businessNoVisa | object | Bedriftskort BankAxept |
businessWithVisa | object | Bedriftskort Visa |
Types
| Type |
|---|
| DNB |
Colored |
Metallic |
| Saga |
Gold |
Platinum |
VisaPlatinum |
None |
| PB |
Default |
Platinum |
None |
| Mastercard |
Default |
DefaultWhite |
Metallic |
BlackMetallic |
| ProductType |
BankAxept |
Saga |
PrivateBanking |
None |
| CardType |
Visa |
Mastercard |
None |
| BankAxept |
White |
Black |
| Visa |
Colored |
Metallic |
| Status |
Expired |
Blocked |
Active |