@dcrackel/meyersquaredui/src/stories/Organisms/Tableau/TableauColumn/TabeauColumn.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 TableauColumn from './TableauColumn.vue';
import getDEWithBouts from '../../../../mocks/getDEWithBouts.js';

export default {
    title: 'Organisms/Tableau/TableauColumn',
    component: TableauColumn,
    args: {
        bouts: getDEWithBouts.pools[0].Bouts.filter(bout => bout.RoundLabel === 'Table of 8'),
        roundName: 'Table of 8',
        bracketSize: getDEWithBouts.pools[0].Bouts[0].RoundLabel,
        hostingClubColors: getDEWithBouts.hostingClubColors
    },
    argTypes: {
        bouts: {
            control: 'array',
            description: 'Array of bracket objects to display',
            bracketSize: 'Table of 8',
        },
        bracketSize: {
            control: 'text',
            description: 'Sets spacing for connector lines',
        },
        hostingClubColors: {
            control: 'object'
        }
    }
};

export const Default = {
    args: {
        bouts: getDEWithBouts.pools[0].Bouts.filter(bout => bout.RoundLabel === 'Table of 8'),
        hostingClubColors: getDEWithBouts.hostingClubColors,
        bracketSize: getDEWithBouts.pools[0].Bouts[0].RoundLabel,
        roundName: 'Table of 8'
    }
};