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

import type { NestedTreeItem } from '../../Tree/fixtures';
import { nestedTreeItems } from '../../Tree/fixtures';

import type { TreeFieldProps } from './TreeField';
import { TreeField } from './TreeField';

const meta: Meta<typeof TreeField> = {
  title: 'UI kit/Form/TreeField',
  component: TreeField,
  tags: ['autodocs'],
};

export default meta;
type Story = StoryObj<typeof TreeField<NestedTreeItem, number>>;

const defaultArgs: TreeFieldProps<NestedTreeItem, number> = {
  label: 'File System',
  items: nestedTreeItems,
  getItemValue: item => item.id,
  getItemChildren: item => item.children,
  getItemTextLabel: item => item.title,
  getItemTextDescription: item => item.description,
  defaultValue: [],
};

export const Default: Story = {
  args: {
    ...defaultArgs,
  },
};

export const Required: Story = {
  args: {
    ...defaultArgs,
    required: true,
  },
};

export const Justify: Story = {
  args: {
    ...defaultArgs,
    justify: true,
  },
};

export const LabelHidden: Story = {
  args: {
    ...defaultArgs,
    labelHidden: true,
  },
};

export const Tooltip: Story = {
  args: {
    ...defaultArgs,
    tooltip: 'This is a tooltip for the tree field.',
  },
};

export const WithSelection: Story = {
  args: {
    ...defaultArgs,
    value: [1, 3],
  },
};

export const WithExpandedValues: Story = {
  args: {
    ...defaultArgs,
    defaultExpandedValues: [1, 13],
  },
};

export const Hint: Story = {
  args: {
    ...defaultArgs,
    hint: 'This is a hint for the tree field.',
  },
};

export const Error: Story = {
  args: {
    ...defaultArgs,
    error: 'This is an error message for the tree field.',
  },
};

export const Warning: Story = {
  args: {
    ...defaultArgs,
    warning: 'This is a warning message for the tree field.',
  },
};