import { StoryObj, Meta } from '@storybook/react';

import { RULES_DATA } from './Rules.data';
import { Rule } from '@/components';

const meta: Meta<typeof Rule> = {
  component: Rule,
};

export default meta;

type TStory = StoryObj<typeof Rule>;

export const AlwaysPairsWith: TStory = {
  args: {
    text: RULES_DATA[0].text,
    color: RULES_DATA[0].color,
    onClick: () => {},
    disabled: false,
    children: RULES_DATA[0].icon,
  },
};

export const AppearsWithAtLeastOne: TStory = {
  args: {
    text: RULES_DATA[1].text,
    color: RULES_DATA[1].color,
    onClick: () => {},
    disabled: false,
    children: RULES_DATA[1].icon,
  },
};

export const DoesNotMixWith: TStory = {
  args: {
    text: RULES_DATA[2].text,
    color: RULES_DATA[2].color,
    onClick: () => {},
    disabled: false,
    children: RULES_DATA[2].icon,
  },
};

export const OnlyMixesWith: TStory = {
  args: {
    text: RULES_DATA[3].text,
    color: RULES_DATA[3].color,
    onClick: () => {},
    disabled: false,
    children: RULES_DATA[3].icon,
  },
};

export const RuleDisabled: TStory = {
  args: {
    text: RULES_DATA[3].text,
    color: RULES_DATA[3].color,
    onClick: () => {},
    disabled: true,
    children: RULES_DATA[3].icon,
  },
};