@dcrackel/meyersquaredui/src/stories/Organisms/Cards/FencerListCard/FencerListCard.stories.js

This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.

import FencerListCard from './FencerListCard.vue';

export default {
    title: 'Organisms/Cards/FencerListCard',
    component: FencerListCard,
};

const Template = (args) => ({
    components: { FencerListCard },
    setup() {
        return { args };
    },
    template: '<FencerListCard v-bind="args" @card-click="onCardClick" />',
    methods: {
        onCardClick(fencer) {
            alert(`Fencer selected: ${fencer.DisplayName}`);
        },
    },
});

export const Default = Template.bind({});
Default.args = {
    data: {
        "Place": 1,
        "M2Rating": "U",
        "Awarded": null,
        "Person": {
            "PersonId": 43,
            "DisplayName": "Derek Ray",
            "Pronouns": "He/Him",
            "ClubId": 10,
            "ShowData": true,
            "Club": {
                "Name": "Columbus United Fencing Club",
                "Images": []
            },
            "Images": [{ URL: 'https://randomuser.me/api/portraits/men/14.jpg' }],
            "Metrics": []
        },
        "HandShotCount": 0,
        "DoubleCount": 0
    },
    index: 1,
    isLoading: false,
    showHRRatings: true,
};

export const NoHR = Template.bind({});
NoHR.args = {
    data: {
        DisplayName: 'John Doe',
        Club: { Name: 'Awesome Fencing Club' },
        M2Ratings: [{ WeaponId: 1, FormattedRating: 'A23' }],
        HEMARatings: [{ WeaponId: 1, Rating: '1436.7' }],
        ProfileImage: { URL: 'https://randomuser.me/api/portraits/men/14.jpg' },
    },
    index: 1,
    isLoading: false,
    showHRRatings: false,
};

export const NoProfileImage = Template.bind({});
NoProfileImage.args = {
    data: {
        DisplayName: 'John Doe',
        Club: { Name: 'Awesome Fencing Club' },
        M2Ratings: [{ WeaponId: 1, FormattedRating: 'A23' }],
        HEMARatings: [{ WeaponId: 1, Rating: '1436.7' }],
        ProfileImage: { },
    },
    index: 1,
    isLoading: false,
    showHRRatings: false,
};