import { Meta, StoryObj } from '@storybook/react-webpack5';
import { Settings } from '@transferwise/icons';
import ActionButton from './ActionButton';
import { withVariantConfig } from '../../.storybook/helpers';

const meta: Meta<typeof ActionButton> = {
  component: ActionButton,
  tags: ['!autodocs', '!manifest', 'deprecated'],
  title: 'Actions/ActionButton/Tests',
};
export default meta;

type Story = StoryObj<typeof ActionButton>;

export const DisabledVariants: Story = {
  render: (args) => (
    <div style={{ display: 'flex', flexDirection: 'column', gap: '0.4rem' }}>
      <div>
        <ActionButton priority="primary" {...args}>
          Primary label
        </ActionButton>
        <ActionButton priority="secondary" {...args}>
          Secondary label
        </ActionButton>
        <ActionButton priority="tertiary" {...args}>
          Tertiary label
        </ActionButton>
      </div>
      <div>
        <ActionButton priority="primary" {...args}>
          <Settings />
          Primary label
        </ActionButton>
        <ActionButton priority="secondary" {...args}>
          <Settings />
          Secondary label
        </ActionButton>
        <ActionButton priority="tertiary" {...args}>
          <Settings />
          Tertiary label
        </ActionButton>
      </div>
    </div>
  ),
  args: {
    disabled: true,
  },
  ...withVariantConfig(['default', 'dark', 'rtl', 'mobile']),
};