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. import { Designs } from '@dnb/eufemia/extensions/payment-card' (see available designs below) or a custom one can be created. |
cardType | Union Type | (required)import { CardType } from '@dnb/eufemia/extensions/payment-card' to use. Can be CardType.Visa, CardType.Mastercard or CardType.None |
productType | Union Type | (required)import { ProductType } from '@dnb/eufemia/extensions/payment-card' to use. Can be ProductType.Saga, ProductType.Pluss, ProductType.Intro, ProductType.Business, ProductType.Bedrift, 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') |
visa | Union Type | (required) Union Type. import Visa from ./card/utils/Types to use. Can be Visa.Colored('HexValue') or Visa.Platinum |
mastercard | Union Type | (required) Union Type. import Mastercard from ./card/utils/Types to use. Can be Mastercard.Default or Mastercard.Dark |
bankAxept | Union Type | (required) Union Type. import BankAxept from ./card/utils/Types to use. Can be BankAxept.White, BankAxept.Black, BankAxept.Gold, BankAxept.Black20 or BankAxept.Gray |
saga | Union Type | (required) Union Type. import Saga from ./card/utils/Types to use. Can be Saga.Gold, Saga.Platinum or Saga.None |
privateBanking | Union Type | (required) Union Type. import PB from ./card/utils/Types to use. Can be PB.Default or PB.None |
List of designs
Properties | Type | Description |
---|---|---|
defaultDesign | object | Default |
pluss | object | Pluss |
young | object | Ung |
myFirst | object | My first |
youth | object | Youth |
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 |
Saga |
Gold |
Platinum |
None |
PB |
Default |
None |
Mastercard |
Default |
Dark |
ProductType |
Saga |
Pluss |
Intro |
Bedrift |
Business |
PrivateBanking |
None |
CardType |
Visa |
Mastercard |
None |
BankAxept |
White |
Black |
Gold |
Black20 |
Gray |
Visa |
Colored |
Platinum |
Status |
Expired |
Blocked |
Active |