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

const meta: Meta<typeof Breadcrumbs> = {
  title: 'UI/Breadcrumbs',
  component: Breadcrumbs,
  parameters: { layout: 'centered' },
  tags: ['autodocs'],
};
export default meta;
type Story = StoryObj<typeof Breadcrumbs>;

export const Default: Story = {
  args: {
    items: [{ label: 'Scenarios', href: '#' }, { label: 'Login flow' }],
  },
};

export const Deep: Story = {
  args: {
    items: [
      { label: 'Home', href: '#' },
      { label: 'Scenarios', href: '#' },
      { label: 'Login flow', href: '#' },
      { label: 'Step 3' },
    ],
  },
};

export const SingleItem: Story = {
  args: {
    items: [{ label: 'Dashboard' }],
  },
};

export const CustomSeparator: Story = {
  args: {
    separator: '/',
    items: [
      { label: 'Environments', href: '#' },
      { label: 'Staging', href: '#' },
      { label: 'Config' },
    ],
  },
};