import type { Meta, StoryObj } from '@storybook/svelte';
import SidebarNav from './SidebarNav.svelte';

const meta = {
  title: 'UI/SidebarNav',
  component: SidebarNav,
  tags: ['autodocs'],
  parameters: {
    docs: {
      description: {
        component: 'Seitennavigation mit gruppierten Links. `groups`: Array aus `{ label, links: [{ href, label, active? }] }`.',
      },
    },
  },
} satisfies Meta<SidebarNav>;

export default meta;
type Story = StoryObj<typeof meta>;

export const Default: Story = {
  args: {
    groups: [
      {
        label: 'Kategorie',
        links: [
          { href: '#', label: 'Link 1' },
          { href: '#', label: 'Link 2', active: true },
          { href: '#', label: 'Link 3' },
        ],
      },
      {
        label: 'Kategorie 2',
        links: [
          { href: '#', label: 'Link 4' },
          { href: '#', label: 'Link 5' },
        ],
      },
    ],
  },
};
