import React from 'react';

import { ComponentMeta, ComponentStory } from '@storybook/react';

import { Checkbox } from './Checkbox';

export default {
  title: 'ReactComponentLibrary/Checkbox',
  component: Checkbox,
  decorators: [
    (Story): JSX.Element => (
      <div className="centered-layout">
        <Story />
      </div>
    ),
  ],
} as ComponentMeta<typeof Checkbox>;

const Template: ComponentStory<typeof Checkbox> = (args) => <Checkbox {...args} />;

export const CheckboxDefault = Template.bind({});
CheckboxDefault.args = {
  checked: true,
};

export const CheckboxIntermediate = Template.bind({});
CheckboxIntermediate.args = {
  checked: true,
  intermediate: true,
};

export const CheckboxError = Template.bind({});
CheckboxError.args = {
  checked: true,
  hasError: true,
};

export const CheckboxDisabled = Template.bind({});
CheckboxDisabled.args = {
  checked: true,
  disabled: true,
};