import { Meta, StoryObj } from '@storybook/react';
import LineChart from '../../components/ApexCharts/LineChart';
import { ChartData } from "../../models/Riview/ChartData";
import NarrowContainer from "../../components/UI/Layout/NarrowContainer";


 /***
 * Line Chart component
 * 
 * Apex Charts libary is used for all DUA charts
 * 
 * Apex Charts Documentation: https://apexcharts.com/docs/chart-types/line-chart/
 */
const meta: Meta<typeof LineChart> = {
    title:'Components/Charts/LineChart',
    component: LineChart,
    decorators: [
      (Story) => (
        <NarrowContainer>
            <Story/>
        </NarrowContainer>
      ),
    ]
  };

export default meta;
type Story = StoryObj<typeof LineChart>;

export const LineChartEx: Story = {
    args: {
        data: {
            series: [
              {
                name: 'Series 1',
                data: [10, 20, 30, 40, 50, 60, 70],
              },
            ],
            labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul'],
        } as ChartData,
    },
};