import type { Meta, StoryObj } from '@storybook/react'
import React from 'react'
import { Breadcrumb } from './Breadcrumb'
import { NeutralPillTab, NeutralPillTabs, NeutralPillTabsList, PillTab, PillTabs, PillTabsList } from './PillTabs'
import { Tab, TabContent, TabList, Tabs } from './Tabs'

const meta: Meta = {
  title: 'Components/Navigation',
  parameters: { layout: 'centered' },
}
export default meta

export const BreadcrumbStory: StoryObj = {
  name: 'Breadcrumb',
  render: () => (
    <Breadcrumb
      items={[
        { label: '메인', href: '/' },
        { label: '도구 관리', href: '/tools' },
        { label: '회의록 요약' },
      ]}
    />
  ),
}

export const TabsStory: StoryObj = {
  name: 'Tabs',
  render: () => (
    <div className="w-96">
      <Tabs defaultValue="overview">
        <TabList>
          <Tab value="overview">개요</Tab>
          <Tab value="settings">설정</Tab>
          <Tab value="logs">로그</Tab>
        </TabList>
        <TabContent value="overview">
          <div className="pt-4 text-[13px] text-slate-600">개요 내용입니다.</div>
        </TabContent>
        <TabContent value="settings">
          <div className="pt-4 text-[13px] text-slate-600">설정 내용입니다.</div>
        </TabContent>
        <TabContent value="logs">
          <div className="pt-4 text-[13px] text-slate-600">로그 내용입니다.</div>
        </TabContent>
      </Tabs>
    </div>
  ),
}

export const PillTabsPrimary: StoryObj = {
  name: 'PillTabs (Primary)',
  render: () => (
    <PillTabs defaultValue="all">
      <PillTabsList>
        <PillTab value="all">전체</PillTab>
        <PillTab value="active">활성</PillTab>
        <PillTab value="inactive">비활성</PillTab>
      </PillTabsList>
    </PillTabs>
  ),
}

export const PillTabsNeutral: StoryObj = {
  name: 'PillTabs (Neutral)',
  render: () => (
    <NeutralPillTabs defaultValue="one-to-one">
      <NeutralPillTabsList>
        <NeutralPillTab value="one-to-one">1:1</NeutralPillTab>
        <NeutralPillTab value="many-to-many">N:N</NeutralPillTab>
      </NeutralPillTabsList>
    </NeutralPillTabs>
  ),
}