import { provideAnimations } from '@angular/platform-browser/animations';
import { applicationConfig, Meta, StoryObj } from '@storybook/angular';
import { ProgressComponent } from '../../public-api';

const meta: Meta<ProgressComponent> = {
  title: 'Components/Progress',
  id: 'progress',
  component: ProgressComponent,
  decorators: [
    applicationConfig({
      providers: [provideAnimations()]
    })
  ],
  parameters: {
    docs: {
      description: {
        component:
          'This component uses animations so you may need to import `BrowserAnimationModule` in your AppModule for it to work'
      },
      imports: [ProgressComponent]
    }
  }
};

export default meta;

type Story = StoryObj<ProgressComponent>;
export const Progress: Story = {
  args: {
    label: 'Label of the progressbar',
    value: 50
  }
};

export const ProgressWithDescription: Story = {
  args: {
    label: 'Label of the progressbar',
    value: 50,
    descriptionPosition: 'bottom'
  }
};

export const ProgressWithDescriptionOnTheRight: Story = {
  args: {
    label: 'Label of the progressbar',
    value: 50,
    descriptionPosition: 'right'
  }
};
