import React from 'react';
import { cn } from './utils';
interface CalloutProps {
type?: 'info' | 'warning' | 'success' | 'tip';
title?: string;
children: React.ReactNode;
className?: string;
}
const icons = {
info: (
),
warning: (
),
success: (
),
tip: (
),
};
const styles = {
info: 'bg-blue-50 border-blue-200 text-blue-900',
warning: 'bg-yellow-50 border-yellow-200 text-yellow-900',
success: 'bg-green-50 border-green-200 text-green-900',
tip: 'bg-purple-50 border-purple-200 text-purple-900',
};
const iconColors = {
info: 'text-blue-500',
warning: 'text-yellow-500',
success: 'text-green-500',
tip: 'text-purple-500',
};
export function Callout({ type = 'info', title, children, className }: CalloutProps) {
return (
{icons[type]}
{title && (
{title}
)}
{children}
);
}