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

import { Button } from '../Button/Button';

import { SectionControls } from './SectionControls/SectionControls';
import { Section } from './Section';

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

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

export const Default: Story = {
  args: {
    title: 'Section Title',
    children: <SectionControls primaryButton={<Button value='Click'>Button</Button>} />,
  },
};

export const PreviousNextLinks: Story = {
  args: {
    title: 'Section Title',
    previous: <Section.Link type='previous' />,
    next: <Section.Link type='next' href='#' />,
    children: <SectionControls primaryButton={<Button value='Click'>Button</Button>} />,
  },
};