@dcrackel/meyersquaredui/src/stories/Organisms/Cards/FencerCard/FencerCard.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 FencerCard from './FencerCard.vue';
import mockTopFencers from "../../../../mocks/getTopFencers.js";

export default {
    title: 'Organisms/Cards/FencerCard',
    component: FencerCard,
    argTypes: {
        portrait: { control: 'text' },
        displayName: { control: 'text' },
        clubName: { control: 'text' },
        m2Rating: { control: 'number' },
        hrRating: { control: 'number' },
    },
};

const Template = (args) => ({
    components: { FencerCard },
    setup() {
        return { args };
    },
    template: '<FencerCard v-bind="args" />',
});

export const Default = Template.bind({});
Default.args = {
    data: mockTopFencers[0]
};

export const HighRating = Template.bind({});
HighRating.args = {
    data: mockTopFencers[0],
};

export const NoRating = Template.bind({});
NoRating.args = {
    data: mockTopFencers[0],
};

export const Loading = Template.bind({});
Loading.args = {
    data: mockTopFencers[0],
    isLoading: true
};