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


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


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

export const BarChartHorizontalEx: 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,
    },
};
