/* eslint-disable react-hooks/rules-of-hooks */
import React, {useState} from 'react';
import {Meta, StoryObj} from '@storybook/react';

import {Checkbox} from './index';

const meta: Meta<typeof Checkbox> = {
  title: 'HuGo/Checkbox',
  component: Checkbox,
  argTypes: {
    title: {control: 'text'},
    description: {control: 'text'},
    disabled: {control: 'boolean'},
    error: {control: 'boolean'},
    extraData: {control: 'text'},
    checked: {control: 'boolean'},
    semiChecked: {control: 'boolean'},
  },
};

type Story = StoryObj<typeof Checkbox>;

export const CheckboxComponent: Story = {
  args: {title: 'Checkbox'},
  render: args => {
    const [checked, setChecked] = useState(args.checked);
    return (
      <Checkbox
        {...args}
        checked={checked}
        onPress={() => setChecked(!checked)}
      />
    );
  },
};

export default meta;
