PaymentCardListItem.stories.ts
779 Bytes
import CardListItem from './PaymentCardListItem.vue'
import { PaymentSystemType, PaymentCard } from '../../types'
export default {
title: 'CardListItem',
component: CardListItem,
tags: ['autodocs'],
}
export const Default = () => ({
components: { CardListItem },
data() {
return {
card: {
id: '1',
name: 'Main card',
isPrimary: true,
paymentSystem: PaymentSystemType.Visa,
cardNumberMasked: '****1679',
expirationDate: '09/24',
} satisfies PaymentCard,
lastEvent: '___',
}
},
template: `
<CardListItem
:card="card"
@remove="lastEvent = 'remove'"
@edit="lastEvent = 'edit'"
/>
<br>
<p>Last event: <span data-testid>{{ lastEvent }}</span></p>
`,
})