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

const meta = {
  title: 'Molecules/SectionHeader',
  component: SectionHeader,
  tags: ['autodocs'],
  argTypes: {
    number: { control: 'text' },
    kicker: { control: 'text' },
    title: { control: 'text' },
    subtitle: { control: 'text' },
    actionLabel: { control: 'text' },
    actionHref: { control: 'text' },
    tag: { control: 'select', options: ['h1', 'h2', 'h3'] },
  },
} satisfies Meta<typeof SectionHeader>;

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

export const MitAktion: Story = {
  args: {
    number: '03',
    kicker: 'Vor Ort',
    title: 'Beteiligte Initiativen',
    subtitle: '13 Bürgerinitiativen im Bündnis — direkt vor Ort ansprechbar.',
    actionLabel: 'Zum Adressbuch',
    actionHref: '/adressbuch',
  },
};

export const OhneAktion: Story = {
  args: { number: '01', kicker: 'Über uns', title: 'Wer sind wir?' },
};

export const OhneNummer: Story = {
  args: {
    kicker: 'Aktuelles',
    title: 'Die letzten Beiträge',
    actionLabel: 'Alle Beiträge',
    actionHref: '/aktuelles',
  },
};