Default(NK1)
Kortnummer
**** 1337
Basic card using productCode.
Kortnummer
**** 1337
<PaymentCard product_code="NK1" card_number="************1337" />
You may have to import the extra named exports:
import PaymentCard, {getCardData,Designs,ProductType,CardType,BankAxeptType,} from '@dnb/eufemia/extensions/PaymentCard'
Kortnummer
**** 1337
const customData = {productCode: 'UNDEFINED',productName: 'DNB Custom Card',displayName: 'Custom card',cardDesign: Designs.gold,cardType: CardType.Visa,productType: ProductType.None,bankAxept: BankAxeptType.BankAxept,}render(<PaymentCardproduct_code="UNDEFINED"raw_data={customData}card_number="************1337"/>)
Kortnummer
**** 1337
<PaymentCardproduct_code="VG2"card_status="blocked"card_number="************1337"/>
Basic card using product code and status.
NB: The compact variant have to be aligned to a not yet defined SSOT style.
Kortnummer
**** 1337
<PaymentCardvariant="compact"product_code="VG1"card_number="************1337"/>
All the different card products and PaymentCard designs.
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
Kortnummer
**** 1337
const demoCards = ['NK1','NK4','NK5','VE1','VE2','VG1','VG4','053','VK2','VK4','084','VL1','VL2','VL3','VL4','VL6','085','VO1','VP2','VP3','VP4','069','VP5','080','VX1','VX3','VX4','VX5','096','044','043','098','074','062','BK1','BP1','VB1','VB2','VB5','P101',]const Cards = () => (<>{demoCards.map((product_code) => {const cardData = getCardData(product_code)return (<article key={product_code}><H4>{cardData.cardDesign.name}({product_code})</H4><PaymentCardproduct_code={product_code}card_number="************1337"/></article>)})}</>)render(<Cards />)