@dcrackel/meyersquaredui

Version:

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.

44 lines (42 loc) • 1.67 kB

JavaScript

View Raw

import HomePage from './TournamentListPage.vue';
import mockTournaments from "../../../mocks/getTournamentsMock.js";
import mockTopFencers from "../../../mocks/getTopFencers.js";
import mockArticles from "../../../mocks/getArticles.js";
export default {
    title: 'Templates/TournamentListPage',
    component: HomePage,
    argTypes: {
        'button-click': { action: 'button-click' },
        title: { control: 'text', description: 'Title for the HeroBanner' },
        description: { control: 'text', description: 'Description for the HeroBanner' },
        buttonLabel: { control: 'text', description: 'Button label for the HeroBanner' },
        imageSrc: { control: 'text', description: 'Image source for the HeroBanner' },
    },
};

export const Default = {
    args: {
        title: 'Find HEMA Tournaments',
        description: 'Near your location!',
        imageSrc: 'https://meyersquaredimages.com/images/banners/thinbanner02m1.png',
        tournaments: mockTournaments,
        topFencers: mockTopFencers,
        articles: mockArticles,
        tournamentsIsLoading: false,
        topFencersIsLoading: false,
        articlesIsLoading: false,
    },
};

export const AllLoading = {
    args: {
        title: 'Discover, Compete, Connect',
        description: '',
        buttonLabel: 'Find Out More',
        imageSrc: 'https://meyersquaredimages.com/images/banners/largebanner01.jpg',
        tournaments: mockTournaments,
        topFencers: mockTopFencers,
        articles: mockArticles,
        tournamentsIsLoading: true,
        topFencersIsLoading: true,
        articlesIsLoading: true,
    },
};