import type { Meta, StoryObj } from '@storybook/react'
import React from 'react'
import { Callout } from './Callout'

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

export const AllVariants: StoryObj = {
  name: 'Callout — 4종',
  render: () => (
    <div className="space-y-2 w-[480px]">
      <Callout variant="info">선택한 열만 검수 대상이 됩니다. 불필요한 열은 체크를 해제하면 정확도가 높아집니다.</Callout>
      <Callout variant="warning">유사도 임계값이 낮으면 비슷한 표현도 중복으로 감지됩니다.</Callout>
      <Callout variant="error">파일 업로드에 실패했습니다. 파일 형식을 확인하세요.</Callout>
      <Callout variant="tip">프롬프트에 <code className="px-1 bg-blue-100 rounded text-[11px]">{'{{컬럼명}}'}</code>을 입력하면 데이터 값이 자동으로 치환됩니다.</Callout>
    </div>
  ),
}