import { Meta, StoryObj } from '@storybook/angular';
import { withContrastedVariant } from '../../../.storybook/utils/with-contrasted-variant.decorator';
import { IconButtonComponent } from '../../public-api';

const meta: Meta<IconButtonComponent> = {
  title: 'Components/Icon Button',
  id: 'icon-button',
  component: IconButtonComponent,
  argTypes: {
    type: {
      control: {
        type: null
      }
    },
    buttonClick: {
      control: {
        type: null
      }
    },
    size: {
      type: 'string',
      control: 'radio',
      options: ['2xs', 'xs', 'sm', 'md', 'lg', 'xl']
    }
  },
  decorators: [
    withContrastedVariant({
      stateByProps: (props) => {
        return props['variant'] === 'inverse' ? 'inverse' : null;
      }
    })
  ],
  parameters: {
    docs: {
      imports: [IconButtonComponent]
    }
  }
};
export default meta;

type Story = StoryObj<IconButtonComponent>;

export const IconButton: Story = {
  args: {
    label: 'Some accessible label',
    icon: 'close'
  }
};