button.stories.ts

import { argsToTemplate, moduleMetadata, type Meta, type StoryObj } from '@storybook/angular';

import { FileIconComponent } from '../icons/file-icon/file-icon.component';
import { ButtonComponent } from './button.component';

const meta: Meta<ButtonComponent> = {
  title: 'Button',
  component: ButtonComponent,
  decorators: [
    moduleMetadata({
      imports: [ButtonComponent, FileIconComponent],
    }),
  ],
  excludeStories: /.*Data$/,
  tags: ['autodocs'],
};

export default meta;
type Story = StoryObj<ButtonComponent>;

export const Default: Story = {
  args: {
    text: 'Hello world!',
    isLoading: false,
    variant: 'primary',
  },
  argTypes: {
    variant: {
      options: ['primary', 'outline'],
      control: { type: 'radio' },
      table: { defaultValue: { summary: 'primary' } },
    },
  },
};

export const WithIcon: Story = {
  args: {
    text: 'I have an icon',
    variant: 'outline',
  },
  render: (args) => ({
    props: args,
    template: `<ods-button ${argsToTemplate(args)}>
      <ods-file-icon icon fileType='pdf' size='small'></ods-file-icon>
    </ods-button>`,
  }),
};

export const IsLoading: Story = {
  args: {
    text: 'Loading...',
    isLoading: true,
  },
};