@dcrackel/meyersquaredui/src/stories/Organisms/Charts/LineChart.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 BaseLineChart from './LineChart.vue';

export default {
    title: 'Organisms/Charts/BaseLineChart',
    component: BaseLineChart,
    argTypes: {
        borderColor: { control: 'color' },
        showPercent: { control: 'boolean' },
        fill: { control: 'boolean' },
        maxY: { control: 'number' },
    },
};

const Template = (args) => ({
    components: { BaseLineChart },
    setup() {
        return { args };
    },
    template: `
    <div style="height: 300px;">
      <BaseLineChart v-bind="args" />
    </div>
  `,
});

export const Default = Template.bind({});
Default.args = {
    labels: ['2019', '2020', '2021', '2022', '2023', '2024'],
    values: [42, 55, 68, 74, 80, 76],
    datasetLabel: 'Win % by Year',
    borderColor: '#10B981',
    fill: false,
    maxY: 100,
    showPercent: true
};