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


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


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

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